:root{color:#17202a;font-synthesis:none;text-rendering:optimizelegibility;background:#f4f7f6;font-family:Inter,Segoe UI,Noto Sans Thai,system-ui,sans-serif}*{box-sizing:border-box}body{min-width:320px;margin:0}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.6}.center-screen,.login-page{justify-content:center;align-items:center;min-height:100vh;padding:24px;display:flex}.login-page{background:linear-gradient(120deg,#155e751f,#0000 38%),linear-gradient(320deg,#10b98129,#0000 42%),#f4f7f6}.login-panel{background:#fff;border:1px solid #dbe4e1;border-radius:8px;gap:16px;width:100%;max-width:380px;padding:28px;display:grid;box-shadow:0 18px 42px #15202a1f}.brand-mark{color:#fff;background:#0f766e;border-radius:8px;justify-content:center;align-items:center;width:48px;height:48px;display:flex}h1,h2,h3,p{margin:0}h1{font-size:26px}h2{font-size:28px}h3{font-size:16px}label{color:#46545f;gap:7px;font-size:13px;display:grid}input{color:#17202a;background:#fff;border:1px solid #cdd8d4;border-radius:6px;width:100%;min-height:40px;padding:9px 11px}input:focus{border-color:#0f766e;outline:3px solid #0f766e21}.login-panel button,.compact-form button,.form-grid button,.outline-button{border:0;border-radius:6px;justify-content:center;align-items:center;gap:8px;min-height:40px;padding:9px 13px;display:inline-flex}.login-panel button,.compact-form button,.form-grid button{color:#fff;background:#0f766e}.outline-button{color:#17202a;background:#fff;border:1px solid #cdd8d4}.outline-button.danger{color:#b42318}.outline-button.danger:hover{background:#fff5f3;border-color:#f4a9a1}.icon-button{color:#26323b;background:#fff;border:1px solid #d7e0dd;border-radius:6px;justify-content:center;align-items:center;width:36px;height:36px;padding:0;display:inline-flex}.icon-button:hover,.outline-button:hover{border-color:#8bb8ae}.icon-button.danger{color:#b42318}.app-shell{grid-template-columns:320px minmax(0,1fr);min-height:100vh;display:grid}.sidebar{background:#fff;border-right:1px solid #dbe4e1;flex-direction:column;gap:18px;padding:22px;display:flex}.sidebar-head,.workspace-head,.table-toolbar,.new-key-box{justify-content:space-between;align-items:center;gap:14px;display:flex}.eyebrow{color:#667781;letter-spacing:0;text-transform:uppercase;font-size:12px;font-weight:700}.compact-form{gap:10px;display:grid}.game-list{gap:8px;display:grid;overflow:auto}.game-item{color:#17202a;text-align:left;background:#fff;border:1px solid #dbe4e1;border-radius:8px;align-items:center;gap:10px;min-height:58px;padding:10px 12px;display:flex}.game-item span{gap:2px;display:grid}.game-item small{color:#667781}.game-item.active{background:#e7f5f1;border-color:#0f766e}.workspace{flex-direction:column;gap:18px;min-width:0;padding:26px;display:flex}.head-actions{gap:8px;display:flex}.notice,.new-key-box{color:#075e45;background:#ecfdf3;border:1px solid #b7e4c7;border-radius:8px;padding:10px 12px}.new-key-box strong{font-family:Consolas,Courier New,monospace}.split{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;display:grid}.panel{background:#fff;border:1px solid #dbe4e1;border-radius:8px;box-shadow:0 10px 28px #15202a0f}.form-grid{align-content:start;gap:12px;padding:16px;display:grid}.quick-days{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;display:grid}.form-grid .day-button{color:#0f5f63;background:#f7fbfa;border:1px solid #cdd8d4;min-height:34px;padding:6px 8px}.form-grid .day-button:hover{background:#e7f5f1;border-color:#0f766e}.custom-expiry{grid-template-columns:minmax(0,1fr) 120px 112px;gap:8px;display:grid}.custom-expiry input,.custom-expiry select{min-height:36px}.custom-expiry select{color:#17202a;background:#fff;border:1px solid #cdd8d4;border-radius:6px;padding:7px 10px}.key-panel{overflow:hidden}.table-toolbar{border-bottom:1px solid #e5ece9;padding:14px}.search-box{align-items:center;gap:8px;width:100%;max-width:420px;display:flex}.search-box input{min-width:0}.table-wrap{overflow:auto}table{border-collapse:collapse;width:100%;min-width:920px}th,td{text-align:left;vertical-align:middle;border-bottom:1px solid #edf2f0;padding:12px 14px}th{color:#667781;text-transform:uppercase;font-size:12px;font-weight:700}.mono{text-overflow:ellipsis;white-space:nowrap;max-width:220px;font-family:Consolas,Courier New,monospace;font-size:12px;overflow:hidden}.copy-key{color:#0f5f63;background:0 0;border:0;align-items:center;gap:8px;padding:0;display:inline-flex}.copy-key span{font-family:Consolas,Courier New,monospace;font-size:12px}.row-actions{justify-content:flex-end;gap:6px;display:flex}.extend-row td{background:#f7fbfa;padding:12px 14px 16px}.extend-panel{grid-template-columns:88px minmax(280px,1fr) 360px;align-items:center;gap:10px;display:grid}.extend-title{color:#46545f;font-size:13px;font-weight:700}.extend-presets,.extend-custom{gap:8px;display:grid}.extend-presets{grid-template-columns:repeat(8,minmax(64px,1fr))}.extend-custom{grid-template-columns:minmax(74px,1fr) 110px 72px 72px}.extend-custom input,.extend-custom select{color:#17202a;background:#fff;border:1px solid #cdd8d4;border-radius:6px;min-height:34px;padding:6px 8px}.extend-panel .day-button{color:#0f5f63;background:#fff;border:1px solid #cdd8d4;border-radius:6px;justify-content:center;align-items:center;min-height:34px;padding:6px 8px;display:inline-flex}.extend-panel .day-button:hover{background:#e7f5f1;border-color:#0f766e}.extend-panel .day-button.ghost{color:#667781}.status{text-align:center;border-radius:999px;min-width:74px;padding:5px 9px;font-size:12px;display:inline-block}.status.active{color:#0f766e;background:#e7f5f1}.status.disabled,.status.expired{color:#b54708;background:#fff2ea}.danger-text{color:#b42318}.empty,.empty-cell,.form-message{color:#667781;font-size:14px}.empty-cell{text-align:center;padding:26px}@media (width<=940px){.app-shell{grid-template-columns:1fr}.sidebar{border-bottom:1px solid #dbe4e1;border-right:0}.game-list{grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}.split{grid-template-columns:1fr}.extend-panel{grid-template-columns:1fr;align-items:stretch}.extend-presets{grid-template-columns:repeat(4,minmax(0,1fr))}.extend-custom{grid-template-columns:minmax(0,1fr) 120px 82px 82px}}@media (width<=560px){.workspace,.sidebar{padding:16px}.workspace-head,.table-toolbar,.new-key-box{flex-direction:column;align-items:stretch}.head-actions{width:100%}.head-actions .outline-button{flex:1}.quick-days,.custom-expiry{grid-template-columns:repeat(2,minmax(0,1fr))}.custom-expiry .day-button{grid-column:1/-1}.extend-presets,.extend-custom{grid-template-columns:repeat(2,minmax(0,1fr))}}