.kiosk-shell{width:var(--kiosk-width, 1080px);height:100vh;display:flex;flex-direction:column;overflow:hidden;position:relative;margin:0 auto}:root{--c-primary-900: #0D2E5C;--c-primary-700: #1A4F99;--c-primary-500: #2B6FD4;--c-primary-100: #D6E6FA;--c-primary-050: #EEF5FD;--c-accent-600: #D95F00;--c-accent-400: #F5821F;--c-accent-100: #FDE8D0;--c-success-700: #1A7A3C;--c-success-100: #D4F0E0;--c-warning-700: #B45309;--c-warning-100: #FEF3C7;--c-error-700: #C62828;--c-error-100: #FDECEA;--c-info-700: #0B5394;--c-info-100: #DBEAFE;--c-neutral-900: #111827;--c-neutral-700: #374151;--c-neutral-500: #6B7280;--c-neutral-300: #D1D5DB;--c-neutral-100: #F3F4F6;--c-neutral-000: #FFFFFF;--c-hw-scanner-active: #0B5394;--c-hw-cash-accepting: #1A7A3C;--c-hw-cash-dispensing: #B45309;--c-hw-card-ready: #1A7A3C;--c-hw-card-processing: #B45309;--c-hw-error: #C62828;--font-kiosk: "Noto Sans JP", "Helvetica Neue", sans-serif;--fs-display: 40px;--fs-h1: 32px;--fs-h2: 26px;--fs-h3: 22px;--fs-body-l: 20px;--fs-body-m: 18px;--fs-caption: 16px;--fs-numeric-xl: 64px;--fs-numeric-l: 48px;--sp-1: 4px;--sp-2: 8px;--sp-3: 12px;--sp-4: 16px;--sp-6: 24px;--sp-8: 32px;--sp-10: 40px;--sp-12: 48px;--sp-16: 64px;--kiosk-width: 1080px;--kiosk-safe: 48px;--kiosk-progress-h: 72px;--kiosk-cta-h: 120px;--r-sm: 4px;--r-md: 8px;--r-lg: 12px;--r-xl: 16px;--r-pill: 9999px;--r-full: 50%;--shadow-0: none;--shadow-1: 0 1px 3px rgba(0,0,0,.1);--shadow-2: 0 4px 12px rgba(0,0,0,.12);--shadow-3: 0 8px 24px rgba(0,0,0,.16)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;background:#0d1117;font-family:var(--font-kiosk);color:var(--c-neutral-900);-webkit-text-size-adjust:100%}body{display:flex;justify-content:center;align-items:flex-start;overflow:hidden}button{touch-action:manipulation;min-height:80px;cursor:pointer;font-family:var(--font-kiosk)}.kiosk-screen{width:var(--kiosk-width);height:100vh;background:var(--c-primary-050);display:flex;flex-direction:column;overflow:hidden;position:relative}.kiosk-content{flex:1;overflow-y:auto;overflow-x:hidden;padding:var(--sp-10) var(--kiosk-safe) var(--sp-6);scroll-behavior:smooth}.kiosk-content::-webkit-scrollbar{width:6px}.kiosk-content::-webkit-scrollbar-track{background:transparent}.kiosk-content::-webkit-scrollbar-thumb{background:var(--c-neutral-300);border-radius:var(--r-pill)}.screen-title{margin-bottom:var(--sp-8)}.screen-title h1{font-size:var(--fs-display);font-weight:700;color:var(--c-primary-900);line-height:1.3}.screen-title .subtitle{font-size:var(--fs-body-l);color:var(--c-neutral-700);margin-top:var(--sp-2);line-height:1.8}.cta-strip{flex-shrink:0;height:var(--kiosk-cta-h);background:var(--c-neutral-000);border-top:1px solid var(--c-neutral-300);box-shadow:0 -4px 16px #00000014;display:flex;align-items:center;padding:0 var(--kiosk-safe);gap:var(--sp-6);z-index:100}.btn-back{flex-shrink:0;width:220px;height:72px;background:var(--c-neutral-000);color:var(--c-neutral-700);border:2px solid var(--c-neutral-300);border-radius:var(--r-xl);font-size:var(--fs-body-m);font-weight:600;display:flex;align-items:center;justify-content:center;gap:var(--sp-2);transition:all .15s;touch-action:manipulation}.btn-back:hover{background:var(--c-neutral-100)}.btn-primary{flex:1;height:80px;background:var(--c-accent-600);color:#fff;border:none;border-radius:var(--r-pill);font-size:var(--fs-h2);font-weight:700;display:flex;align-items:center;justify-content:center;gap:12px;box-shadow:var(--shadow-2);transition:all .15s;touch-action:manipulation}.btn-primary:hover:not(:disabled){background:var(--c-accent-400)}.btn-primary:disabled{opacity:.35;cursor:not-allowed;box-shadow:none}.loading-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#eef5fde0;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:500;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--sp-6)}.spinner{width:72px;height:72px;border:6px solid var(--c-primary-100);border-top-color:var(--c-primary-700);border-radius:50%;animation:spin .75s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.error-banner{display:flex;align-items:flex-start;gap:var(--sp-3);background:var(--c-error-100);border-left:4px solid var(--c-error-700);border-radius:0 var(--r-md) var(--r-md) 0;padding:var(--sp-4) var(--sp-6);margin-bottom:var(--sp-6);font-size:var(--fs-body-l);color:var(--c-error-700);line-height:1.6}