.sample-scope{--coral:#e8735a;--turquoise:#2a9d8f;--sand:#faf7f2;--text:#1a1a1a;--muted:#6b7280;--border:#e5e0d8;--card:#fff;--warning-bg:#fef3cd;--warning-text:#92400e}.sample-scope *{box-sizing:border-box}.sample-scope{scroll-behavior:smooth;margin:0;min-height:100vh;background:var(--sand);color:var(--text);font-family:Noto Sans JP,system-ui,sans-serif;letter-spacing:0}.sample-scope button,.sample-scope input,.sample-scope select,.sample-scope textarea{font:inherit}.sample-scope button{cursor:pointer}.sample-scope a{color:inherit;text-decoration:none}.sample-scope code{font-family:Outfit,ui-monospace,monospace}.sample-scope .home{max-width:1180px;margin:0 auto;padding:48px 20px 64px}.sample-scope .home-hero{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:28px;align-items:end;min-height:44vh;padding:36px 0}.sample-scope .demo-no,.sample-scope .eyebrow{color:var(--coral);font-family:Outfit,sans-serif;font-size:.78rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase}.sample-scope .home h1{max-width:900px;margin:10px 0 18px;font-size:clamp(2.2rem,4.6vw,4.6rem);line-height:1.12;letter-spacing:0;word-break:keep-all;overflow-wrap:normal}.sample-scope .sample-title-piece{display:inline-block;white-space:nowrap}.sample-scope .home-lead{max-width:740px;color:var(--muted);font-size:1.05rem;line-height:1.9}.sample-scope .cta-band,.sample-scope .demo-index-card,.sample-scope .home-note,.sample-scope .home-panel,.sample-scope .item-card,.sample-scope .panel,.sample-scope .side-panel,.sample-scope .summary-card{background:var(--card);border:.5px solid var(--border);border-radius:12px}.sample-scope .home-panel{display:grid;gap:10px;padding:22px}.sample-scope .home-panel svg{color:var(--turquoise)}.sample-scope .home-note p,.sample-scope .home-panel span{color:var(--muted);line-height:1.8}.sample-scope .demo-index{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.sample-scope .demo-index-card{display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center;min-height:112px;padding:18px;transition:border-color .2s,transform .2s}.sample-scope .demo-index-card:hover{border-color:var(--coral);transform:translateY(-2px)}.sample-scope .demo-number{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:rgba(232,115,90,.1);color:var(--coral);font-family:Outfit,sans-serif;font-weight:700}.sample-scope .demo-index-card h2{margin:0 0 5px;font-size:1rem}.sample-scope .demo-index-card p{margin:0;color:var(--muted);font-size:.86rem}.sample-scope .home-note{display:flex;gap:12px;align-items:center;margin-top:22px;padding:18px}.sample-scope.app-shell{display:grid;grid-template-columns:240px minmax(0,1fr);min-height:100vh}.sample-scope .sidebar{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;border-right:.5px solid var(--border);background:#fffdfa;padding:22px 14px;z-index:40}.sample-scope .brand-block{padding:6px 8px 18px}.sample-scope .back-link{display:inline-flex;gap:8px;align-items:center;color:var(--muted);font-size:.86rem;margin-bottom:22px}.sample-scope .brand-block h1{margin:8px 0;font-size:1.2rem;line-height:1.45}.sample-scope .brand-block span{color:var(--muted);font-size:.86rem}.sample-scope .side-nav{display:grid;gap:6px}.sample-scope .side-nav a{display:flex;align-items:center;gap:10px;padding:11px 12px;border-radius:8px;color:var(--muted);font-size:.92rem}.sample-scope .side-nav a.active,.sample-scope .side-nav a:hover{background:rgba(232,115,90,.1);color:var(--coral)}.sample-scope .repo-note{display:grid;gap:5px;margin-top:auto;padding:12px;border-top:.5px solid var(--border);color:var(--muted);font-size:.75rem}.sample-scope .repo-note code{color:var(--text);overflow-wrap:anywhere}.sample-scope .content{min-width:0;padding:26px clamp(18px,4vw,46px) 52px}.sample-scope .demo-banner{display:flex;align-items:center;gap:10px;width:100%;margin-bottom:28px;padding:12px 14px;border-radius:8px;background:var(--warning-bg);color:var(--warning-text);font-size:.9rem}.sample-scope .page-head{max-width:820px;margin-bottom:28px}.sample-scope .page-head h2{margin:8px 0 10px;font-size:clamp(1.7rem,4vw,3rem);line-height:1.22;letter-spacing:0}.sample-scope .page-head p:last-child{margin:0;color:var(--muted);line-height:1.8}.sample-scope .stack{display:grid;gap:20px}.sample-scope .grid-two{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,.7fr);gap:20px}.sample-scope .align-start{align-items:start}.sample-scope .summary-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.sample-scope .summary-card{min-height:112px;padding:18px}.sample-scope .summary-card span{display:block;color:var(--muted);font-size:.85rem}.sample-scope .summary-card strong{display:block;margin-top:16px;font-family:Outfit,sans-serif;font-size:2rem;line-height:1}.sample-scope .tone-coral,.sample-scope .tone-coral em,.sample-scope .tone-coral strong{color:var(--coral)}.sample-scope .tone-turquoise,.sample-scope .tone-turquoise em,.sample-scope .tone-turquoise strong{color:var(--turquoise)}.sample-scope .tone-muted{color:var(--muted)}.sample-scope .panel{padding:20px}.sample-scope .panel h3{margin:0 0 16px;font-size:1rem}.sample-scope .bar-chart{display:grid;grid-template-columns:repeat(7,1fr);gap:12px;height:230px;align-items:end}.sample-scope .bar-item{display:grid;grid-template-rows:1fr auto;gap:8px;height:100%;text-align:center}.sample-scope .bar-track{display:flex;align-items:end;min-height:160px;border-radius:8px;background:rgba(42,157,143,.1);overflow:hidden}.sample-scope .bar-track span{width:100%;min-height:10px;background:linear-gradient(180deg,var(--coral),#f4a261);border-radius:8px 8px 0 0}.sample-scope .bar-item small,.sample-scope .highlight small,.sample-scope .item-card p,.sample-scope .muted{color:var(--muted)}.sample-scope .highlight-list{display:grid;gap:10px}.sample-scope .highlight{display:flex;justify-content:space-between;gap:12px;width:100%;padding:14px;border:.5px solid var(--border);border-radius:8px;background:#fff;text-align:left}.sample-scope .highlight span{display:grid;gap:3px}.sample-scope .highlight em,.sample-scope .status{align-self:start;border-radius:999px;background:hsla(220,9%,46%,.1);padding:4px 9px;font-size:.75rem;font-style:normal;white-space:nowrap}.sample-scope .highlight.tone-coral em,.sample-scope .status.tone-coral{background:rgba(232,115,90,.12)}.sample-scope .highlight.tone-turquoise em,.sample-scope .status.tone-turquoise{background:rgba(42,157,143,.12)}.sample-scope .toolbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center}.sample-scope .toolbar.end{justify-content:flex-end}.sample-scope input,.sample-scope select,.sample-scope textarea{width:100%;border:.5px solid var(--border);border-radius:8px;background:#fff;padding:10px 12px;color:var(--text);outline:none}.sample-scope input:focus,.sample-scope select:focus,.sample-scope textarea:focus{border-color:var(--coral)}.sample-scope textarea{min-height:110px;resize:vertical}.sample-scope .toolbar input{max-width:260px}.sample-scope .toolbar .mock-field{width:min(260px,100%)}.sample-scope .segmented{display:inline-flex;flex-wrap:wrap;gap:4px;border:.5px solid var(--border);border-radius:8px;background:#fff;padding:4px}.sample-scope .segmented.wide{width:-moz-fit-content;width:fit-content}.sample-scope .segmented button{border:0;border-radius:6px;background:transparent;padding:8px 11px;color:var(--muted)}.sample-scope .segmented button:first-child{background:rgba(42,157,143,.12);color:var(--turquoise)}.sample-scope .card-actions button,.sample-scope .link-button,.sample-scope .primary,.sample-scope .small-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:8px;padding:10px 14px;background:var(--coral);color:#fff;font-weight:700}.sample-scope .primary:disabled{opacity:.55;cursor:wait}.sample-scope .card-actions button,.sample-scope .card-actions span,.sample-scope .small-btn{background:rgba(42,157,143,.12);color:var(--turquoise);font-size:.82rem;border-radius:8px;padding:9px 12px;font-weight:700}.sample-scope .table-wrap{overflow-x:auto;border:.5px solid var(--border);border-radius:12px;background:#fff}.sample-scope table{width:100%;min-width:760px;border-collapse:collapse}.sample-scope td,.sample-scope th{padding:13px 14px;border-bottom:.5px solid var(--border);text-align:left;font-size:.9rem}.sample-scope th{color:var(--muted);font-weight:700}.sample-scope tr:last-child td{border-bottom:0}.sample-scope .side-panel{position:fixed;top:18px;right:18px;z-index:60;width:min(420px,calc(100vw - 36px));max-height:calc(100vh - 36px);overflow:auto;padding:22px}.sample-scope .icon-btn{position:absolute;top:12px;right:12px;display:grid;place-items:center;width:34px;height:34px;border:.5px solid var(--border);border-radius:8px;background:#fff}.sample-scope dl{display:grid;gap:10px}.sample-scope dt{color:var(--muted);font-size:.78rem}.sample-scope dd{margin:0;font-weight:700}.sample-scope .card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.sample-scope .card-grid.single{grid-template-columns:1fr}.sample-scope .item-card{display:grid;gap:14px;min-height:172px;padding:18px}.sample-scope .item-card.compact{min-height:auto}.sample-scope .item-card h3,.sample-scope .menu-card h3{margin:0 0 8px}.sample-scope .item-card p,.sample-scope .menu-card p{margin:0;line-height:1.7}.sample-scope .item-card strong,.sample-scope .menu-card strong{color:var(--coral);font-family:Outfit,sans-serif}.sample-scope .card-actions{display:flex;flex-wrap:wrap;gap:8px}.sample-scope .calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px}.sample-scope .calendar-grid strong{color:var(--muted);text-align:center;font-size:.8rem}.sample-scope .calendar-grid button{display:grid;align-content:start;gap:8px;min-height:82px;border:.5px solid var(--border);border-radius:8px;background:#fff;padding:10px;text-align:left}.sample-scope .calendar-grid button:hover{border-color:var(--coral)}.sample-scope .calendar-grid small{color:var(--coral);font-size:.72rem}.sample-scope .detail-box{display:grid;gap:12px}.sample-scope .form{display:grid;gap:14px}.sample-scope .form.compact-form{gap:10px}.sample-scope .form label{display:grid;gap:6px}.sample-scope .form label span{color:var(--muted);font-size:.84rem}.sample-scope .sample-notice{margin:0;border:.5px solid rgba(232,115,90,.28);border-radius:8px;background:rgba(232,115,90,.09);color:var(--coral);padding:12px 14px;font-size:.88rem;font-weight:700;line-height:1.7}.sample-scope .sample-notice.compact{padding:10px 12px;font-size:.8rem}.sample-scope .mock-field{display:grid;gap:6px}.sample-scope .mock-field>span{color:var(--muted);font-size:.84rem;font-weight:700}.sample-scope .mock-field p{min-height:46px;margin:0;border:.5px solid var(--border);border-radius:8px;background:#fffdfa;color:var(--text);padding:12px 14px;line-height:1.6}.sample-scope .mock-field p.is-multiline{min-height:104px}.sample-scope .mock-button{display:inline-flex;align-items:center;justify-content:center;width:-moz-fit-content;width:fit-content;min-height:42px;border:.5px solid rgba(232,115,90,.28);border-radius:8px;background:rgba(232,115,90,.1);color:var(--coral);padding:10px 16px;font-weight:700}.sample-scope .success{color:var(--turquoise);font-weight:700}.sample-scope .error{color:var(--coral);font-weight:700}.sample-scope .about-page{display:grid;gap:22px}.sample-scope .about-page h3{margin:0;font-size:clamp(1.8rem,4vw,3.4rem);line-height:1.25}.sample-scope .plain-list{display:grid;gap:10px;margin:0;padding:0;list-style:none}.sample-scope .plain-list li{border-left:3px solid var(--coral);padding-left:12px;color:var(--muted)}.sample-scope .plain-list.check li{border-left-color:var(--turquoise)}.sample-scope .cta-band{display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:space-between;padding:20px}.sample-scope .cta-band span{color:var(--muted);font-size:1.1rem;font-weight:700}.sample-scope .floor-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.sample-scope .floor-table{display:grid;gap:10px;min-height:150px;border:.5px solid var(--border);border-radius:12px;padding:18px;text-align:left}.sample-scope .floor-table strong{font-size:1.1rem}.sample-scope .floor-table em{font-style:normal;font-weight:700}.sample-scope .is-free{background:#fffdfa}.sample-scope .is-busy{background:rgba(232,115,90,.14);border-color:rgba(232,115,90,.45)}.sample-scope .is-reserved{background:rgba(42,157,143,.14);border-color:rgba(42,157,143,.45)}.sample-scope .is-cleaning{background:#f3f4f6}.sample-scope .notice-turquoise{border-radius:8px;background:rgba(42,157,143,.13);color:var(--turquoise);padding:12px 14px;font-weight:700}.sample-scope .menu-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.sample-scope .menu-card{display:grid;grid-template-columns:110px minmax(0,1fr);gap:16px;align-items:center;border:.5px solid var(--border);border-radius:12px;background:#fff;padding:14px}.sample-scope .menu-thumb,.sample-scope .photo-grid div{min-height:92px;border-radius:8px;background:linear-gradient(135deg,rgba(232,115,90,.18),rgba(42,157,143,.2)),var(--sand)}.sample-scope .menu-card span{color:var(--turquoise);font-size:.78rem;font-weight:700}.sample-scope .kanban{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.sample-scope .kanban section{display:grid;align-content:start;gap:10px;min-height:360px;border:.5px solid var(--border);border-radius:12px;background:hsla(0,0%,100%,.65);padding:14px}.sample-scope .kanban h3{margin:0}.sample-scope .kanban-card{display:grid;gap:6px;border:.5px solid var(--border);border-radius:8px;background:#fff;padding:12px}.sample-scope .kanban-card span{color:var(--muted)}.sample-scope .kanban-card em{color:var(--coral);font-style:normal;font-weight:700}.sample-scope .report-preview{border:.5px solid var(--border);border-radius:4px;background:#fff;padding:28px}.sample-scope .report-preview h3{margin-top:0;text-align:center}.sample-scope .photo-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.sample-scope .invoice-preview{display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:space-between}.sample-scope .qr-box,.sample-scope .result-box{display:grid;gap:14px}.sample-scope .qr-box canvas{border:.5px solid var(--border);border-radius:12px;padding:10px;background:#fff}.sample-scope .loading{display:inline-flex;gap:10px;align-items:center;color:var(--turquoise);font-weight:700}.sample-scope .loading span{width:22px;height:22px;border:3px solid rgba(42,157,143,.18);border-top:3px solid var(--turquoise);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(1turn)}}.sample-scope .mobile-top,.sample-scope .nav-scrim{display:none}@media (max-width:1020px){.sample-scope .grid-two,.sample-scope .home-hero{grid-template-columns:1fr}.sample-scope .card-grid,.sample-scope .demo-index,.sample-scope .floor-grid,.sample-scope .summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:760px){.sample-scope.app-shell{display:block}.sample-scope .sidebar{position:fixed;left:0;top:0;width:min(86vw,320px);transform:translateX(-110%);transition:transform .25s ease}.sample-scope .sidebar.is-open{transform:translateX(0)}.sample-scope .nav-scrim{position:fixed;inset:0;z-index:30;display:block;border:0;background:rgba(26,26,26,.28)}.sample-scope .mobile-top{position:sticky;top:0;z-index:25;display:grid;grid-template-columns:44px auto 1fr;gap:10px;align-items:center;border-bottom:.5px solid var(--border);background:hsla(38,44%,96%,.92);padding:10px 12px;backdrop-filter:blur(10px)}.sample-scope .mobile-top button{display:grid;place-items:center;width:40px;height:40px;border:.5px solid var(--border);border-radius:8px;background:#fff}.sample-scope .mobile-top span{min-width:0;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sample-scope .content{padding:18px 14px 44px}.sample-scope .home{padding:28px 14px 44px}.sample-scope .home-hero{min-height:auto;padding:18px 0}.sample-scope .card-grid,.sample-scope .demo-index,.sample-scope .floor-grid,.sample-scope .kanban,.sample-scope .menu-grid,.sample-scope .summary-grid{grid-template-columns:1fr}.sample-scope .menu-card{grid-template-columns:84px minmax(0,1fr)}.sample-scope .toolbar input{max-width:none}.sample-scope .segmented,.sample-scope .toolbar{width:100%}.sample-scope .segmented button{flex:1}.sample-scope .calendar-grid{gap:5px}.sample-scope .calendar-grid button{min-height:64px;padding:7px}}