:root{--color-bg: #0d0d0d;--color-surface: #1a1a1a;--color-surface-2: #242424;--color-border: #333333;--color-text: #f0f0f0;--color-text-muted: #999999;--color-new: #ffffff;--color-new-bg: #1e1e2e;--color-new-border: #4444aa;--color-cooking: #ffdd00;--color-cooking-bg: #2a2200;--color-cooking-border: #aaaa00;--color-delayed: #ff3333;--color-delayed-bg: #2a0000;--color-delayed-border: #aa0000;--color-served: #555555;--color-served-bg: #1a1a1a;--color-served-border: #333333;--color-online: #00cc44;--color-reconnecting: #ffaa00;--color-offline: #ff3333;--color-btn-cooking: #ffdd00;--color-btn-cooking-text: #1a1a00;--color-btn-served: #00aa44;--color-btn-served-text: #ffffff;--header-height: 64px;--font-size-base: 18px;--font-size-lg: 22px;--font-size-xl: 28px;--font-size-xxl: 36px;--border-radius: 8px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%;width:100%;overflow:hidden}body{background-color:var(--color-bg);color:var(--color-text);font-family:Hiragino Sans,Hiragino Kaku Gothic ProN,Noto Sans JP,Yu Gothic,Meiryo,sans-serif;font-size:var(--font-size-base);line-height:1.4;-webkit-font-smoothing:antialiased}button{font-family:inherit;cursor:pointer;border:none;background:none}ul,ol{list-style:none}.kds-layout{display:flex;flex-direction:column;height:100vh;width:100vw;overflow:hidden}.kds-header{display:flex;align-items:center;justify-content:space-between;height:var(--header-height);padding:0 20px;background-color:var(--color-surface);border-bottom:2px solid var(--color-border);flex-shrink:0;gap:16px}.kds-header-left{display:flex;align-items:center;gap:16px}.kds-brand{font-size:var(--font-size-xl);font-weight:900;letter-spacing:.15em;color:var(--color-cooking);text-transform:uppercase}.kds-nav{display:flex;gap:8px}.nav-btn{padding:10px 20px;font-size:var(--font-size-base);font-weight:600;border-radius:var(--border-radius);color:var(--color-text-muted);background:transparent;border:2px solid transparent;transition:color .15s,border-color .15s;min-height:44px;min-width:44px}.nav-btn:hover{color:var(--color-text);border-color:var(--color-border)}.nav-btn.nav-active{color:var(--color-cooking);border-color:var(--color-cooking)}.conn-badge{font-size:14px;font-weight:700;padding:4px 12px;border-radius:20px;letter-spacing:.05em}.conn-online{color:var(--color-online);background:#00cc441f;border:1px solid rgba(0,204,68,.3)}.conn-reconnecting{color:var(--color-reconnecting);background:#ffaa001f;border:1px solid rgba(255,170,0,.3);animation:blink 1s ease-in-out infinite}.conn-offline{color:var(--color-offline);background:#ff33331f;border:1px solid rgba(255,51,51,.3)}@keyframes blink{0%,to{opacity:1}50%{opacity:.5}}.kds-main{flex:1;overflow:hidden;display:flex;flex-direction:column}.queue-page{display:flex;flex-direction:column;height:100%;overflow:hidden}.card-grid{flex:1;display:flex;flex-wrap:wrap;gap:16px;padding:16px;overflow-y:auto;align-content:flex-start}.queue-empty{flex:1;display:flex;align-items:center;justify-content:center;font-size:var(--font-size-xl);color:var(--color-text-muted)}.station-tabs{display:flex;gap:4px;padding:8px 16px;background:var(--color-surface);border-bottom:1px solid var(--color-border);flex-shrink:0;overflow-x:auto}.tab-btn{padding:10px 18px;font-size:var(--font-size-base);font-weight:600;border-radius:var(--border-radius);color:var(--color-text-muted);background:var(--color-surface-2);border:2px solid transparent;white-space:nowrap;min-height:44px;transition:color .15s,border-color .15s}.tab-btn:hover{color:var(--color-text)}.tab-btn.tab-active{color:var(--color-cooking);border-color:var(--color-cooking);background:#ffdd0014}.order-card{width:260px;min-height:180px;border-radius:var(--border-radius);border:3px solid;padding:14px;display:flex;flex-direction:column;gap:8px;transition:opacity .6s ease,transform .3s ease}.card-new{background:var(--color-new-bg);border-color:var(--color-new-border);color:var(--color-new)}.card-cooking{background:var(--color-cooking-bg);border-color:var(--color-cooking-border);color:var(--color-cooking)}.card-delayed{background:var(--color-delayed-bg);border-color:var(--color-delayed-border);color:var(--color-delayed);animation:pulse-red 1.5s ease-in-out infinite}.card-served{background:var(--color-served-bg);border-color:var(--color-served-border);color:var(--color-served)}.card-fade-out{opacity:.3}.card-highlight{animation:highlight-in 5s ease-out forwards}@keyframes highlight-in{0%{box-shadow:0 0 0 4px #fffc,0 0 20px #ffffff80;transform:scale(1.03)}30%{box-shadow:0 0 0 4px #fffc,0 0 20px #ffffff80}to{box-shadow:none;transform:scale(1)}}@keyframes pulse-red{0%,to{border-color:var(--color-delayed-border)}50%{border-color:var(--color-delayed);box-shadow:0 0 10px #ff333380}}.card-header{display:flex;justify-content:space-between;align-items:center}.card-table{font-size:var(--font-size-lg);font-weight:800;letter-spacing:.05em}.elapsed-time{font-size:var(--font-size-lg);font-weight:700;font-variant-numeric:tabular-nums}.elapsed-delayed{color:var(--color-delayed);font-weight:900}.card-body{flex:1;display:flex;flex-direction:column;gap:4px}.card-name{font-size:var(--font-size-xl);font-weight:800;line-height:1.2}.card-qty{font-size:var(--font-size-xxl);font-weight:900;font-variant-numeric:tabular-nums}.card-status-badge{font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;opacity:.7}.card-footer{display:flex;gap:8px;margin-top:auto}.btn{padding:12px 16px;font-size:var(--font-size-base);font-weight:700;border-radius:var(--border-radius);min-height:48px;transition:opacity .15s,transform .1s;border:none}.btn:hover{opacity:.85}.btn:active{transform:scale(.97)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-cooking{background:var(--color-btn-cooking);color:var(--color-btn-cooking-text);flex:1}.btn-served{background:var(--color-btn-served);color:var(--color-btn-served-text);flex:1}.btn-login{width:100%;background:var(--color-cooking);color:#111;font-size:var(--font-size-lg);padding:16px;border-radius:var(--border-radius);font-weight:800}.btn-logout{padding:12px 24px;background:var(--color-delayed-bg);color:var(--color-delayed);border:2px solid var(--color-delayed-border);border-radius:var(--border-radius);font-size:var(--font-size-base);font-weight:700}.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--color-bg);padding:24px}.login-card{background:var(--color-surface);border:2px solid var(--color-border);border-radius:12px;padding:48px;width:100%;max-width:440px}.login-title{font-size:var(--font-size-xxl);font-weight:900;color:var(--color-cooking);text-align:center;margin-bottom:8px}.login-subtitle{font-size:var(--font-size-base);color:var(--color-text-muted);text-align:center;margin-bottom:36px}.login-form{display:flex;flex-direction:column;gap:20px}.form-group{display:flex;flex-direction:column;gap:8px}.form-label{font-size:var(--font-size-base);font-weight:600;color:var(--color-text)}.form-input{background:var(--color-surface-2);border:2px solid var(--color-border);border-radius:var(--border-radius);color:var(--color-text);font-size:var(--font-size-lg);padding:14px 16px;font-family:inherit;outline:none;transition:border-color .15s}.form-input:focus{border-color:var(--color-cooking)}.form-input:disabled{opacity:.6}.form-error{color:var(--color-delayed);font-size:var(--font-size-base);font-weight:600;padding:10px;background:var(--color-delayed-bg);border:1px solid var(--color-delayed-border);border-radius:var(--border-radius)}.settings-page{padding:24px;overflow-y:auto;height:100%}.settings-title{font-size:var(--font-size-xl);font-weight:800;margin-bottom:24px}.settings-section{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--border-radius);padding:20px 24px;margin-bottom:20px}.settings-section-title{font-size:var(--font-size-lg);font-weight:700;margin-bottom:16px;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.08em;font-size:14px}.settings-station-list{display:flex;flex-direction:column;gap:12px}.settings-radio-label{display:flex;align-items:center;gap:12px;font-size:var(--font-size-lg);cursor:pointer;padding:10px;border-radius:var(--border-radius);transition:background .15s}.settings-radio-label:hover{background:var(--color-surface-2)}.settings-radio{width:22px;height:22px;accent-color:var(--color-cooking);cursor:pointer}.settings-toggle-label{display:flex;align-items:center;justify-content:space-between;font-size:var(--font-size-lg);cursor:pointer}.toggle-btn{display:flex;align-items:center;gap:10px;padding:8px 16px;border-radius:24px;border:2px solid;font-size:var(--font-size-base);font-weight:700;min-width:120px;min-height:44px;transition:background .2s,border-color .2s}.toggle-on,.toggle-in-stock{background:#00aa4426;border-color:var(--color-btn-served);color:var(--color-btn-served)}.toggle-off,.toggle-sold-out{background:#ff333326;border-color:var(--color-delayed);color:var(--color-delayed)}.toggle-thumb{width:16px;height:16px;border-radius:50%;background:currentColor;flex-shrink:0}.toggle-text{flex:1;text-align:center}.soldout-page{padding:24px;overflow-y:auto;height:100%}.soldout-title{font-size:var(--font-size-xl);font-weight:800;margin-bottom:8px}.soldout-desc{color:var(--color-text-muted);margin-bottom:24px;font-size:var(--font-size-base)}.soldout-list{display:flex;flex-direction:column;gap:8px}.soldout-item{display:flex;align-items:center;gap:16px;padding:14px 16px;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--border-radius)}.soldout-name{flex:1;font-size:var(--font-size-lg);font-weight:600}.soldout-price{font-size:var(--font-size-base);color:var(--color-text-muted);font-variant-numeric:tabular-nums;min-width:60px;text-align:right}.soldout-loading,.soldout-error,.soldout-empty{font-size:var(--font-size-lg);text-align:center;padding:48px;color:var(--color-text-muted)}.soldout-error{color:var(--color-delayed)}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--color-surface)}::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#555}:focus-visible{outline:3px solid var(--color-cooking);outline-offset:2px}.demo-kds #root{display:flex;flex-direction:column}.demo-kds .kds-layout{flex:1;min-height:0;height:auto;width:100%}.demo-kds .kds-main{min-height:0}@media (max-width: 600px){.kds-header{height:auto;padding:12px;flex-wrap:wrap;gap:8px}.kds-nav{width:100%;justify-content:space-between;gap:2px}.nav-btn{padding:8px 12px;font-size:16px}.station-tabs{min-width:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));overflow:visible;padding:8px}.tab-btn{padding:8px 4px;font-size:15px;white-space:normal}.settings-toggle-label{flex-wrap:wrap;gap:12px}.order-card{width:min(260px,100%)}.settings-page,.soldout-page,.settings-section{padding:16px}.soldout-item{flex-wrap:wrap;gap:8px}.soldout-name{flex-basis:100%}}.demo-bar{box-sizing:border-box;display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 16px;background:#fff8f0;color:#492e25;border-bottom:1px solid #e5cfc0;font:13px/1.5 sans-serif;flex-shrink:0}.demo-label{font-weight:700}.demo-bar nav{display:flex;gap:4px;flex-wrap:wrap}.demo-bar a,.demo-bar button,.demo-recovery a,.demo-recovery button{box-sizing:border-box;display:inline-block;padding:7px 11px;min-height:36px;border:1px solid #dec3b3;border-radius:5px;background:#fff;color:#633a2d;text-decoration:none;font:inherit;cursor:pointer}.demo-bar a[aria-current=page]{color:#fff;background:#8b1a1a;border-color:#8b1a1a}.demo-bar button:disabled{opacity:.6;cursor:wait}.demo-hint{margin-left:auto;font-size:12px}.demo-expired{position:fixed;top:0;right:0;bottom:0;left:0;z-index:10000;background:#0009;display:flex;align-items:center;justify-content:center;padding:16px}.demo-recovery{box-sizing:border-box;background:#fff8f0;color:#492e25;border-radius:10px;padding:24px;max-width:520px;margin:24px auto;font:16px/1.7 sans-serif}.demo-recovery a,.demo-recovery button{margin:12px 10px 0 0}@media (max-width: 600px){.demo-bar{padding:8px 12px;gap:6px}.demo-hint{width:100%;margin:0}.demo-label{width:100%}}
