:root{color-scheme:dark;--bg: #0b1020;--panel: #121a2c;--panel-strong: #17213a;--line: #29344d;--text: #eef2f7;--muted: #9aa7bc;--accent: #38bdf8;--accent-strong: #0ea5e9;--danger: #fb7185;--shadow: 0 16px 38px rgba(0, 0, 0, .24)}:root[data-theme=light]{color-scheme:light;--bg: #f5f7fb;--panel: #ffffff;--panel-strong: #eef4fb;--line: #d6deea;--text: #111827;--muted: #5d6b7f;--accent: #0369a1;--accent-strong: #0284c7;--danger: #dc2626;--shadow: 0 12px 28px rgba(15, 23, 42, .1)}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}button,input,textarea{font:inherit}.shell{width:min(1180px,calc(100% - 32px));margin:0 auto;padding:28px 0}.topbar{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:18px}.eyebrow{color:var(--accent);font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}h1,h2,p{margin:0}h1{margin-top:4px;font-size:30px;line-height:1.1}.topbar p{margin-top:6px;color:var(--muted);font-size:14px}.top-actions,.card-actions{display:flex;gap:8px}.button,.icon-button{border:1px solid var(--line);background:var(--panel);color:var(--text);cursor:pointer;min-height:38px}.button{border-radius:8px;padding:0 14px;font-weight:650}.icon-button{width:38px;border-radius:8px;display:inline-grid;place-items:center;font-size:18px;line-height:1}.clock-icon{position:relative;width:18px;height:18px;border:2px solid currentColor;border-radius:999px}.clock-icon:before,.clock-icon:after{content:"";position:absolute;left:50%;top:50%;width:2px;border-radius:999px;background:currentColor;transform-origin:50% 0}.clock-icon:before{height:6px;transform:translate(-50%,-1px) rotate(0)}.clock-icon:after{height:5px;transform:translate(-50%,-1px) rotate(110deg)}.button:hover,.icon-button:hover,.search-results button:hover{border-color:var(--accent)}.danger{color:var(--danger)}.search-box{display:grid;gap:8px;max-width:520px}.search-box label,.modal-card label span{color:var(--muted);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.search-box input,.modal-card input,.modal-card textarea{width:100%;border:1px solid var(--line);border-radius:8px;background:var(--panel);color:var(--text);padding:11px 12px}.search-results{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:8px}.search-results button{border:1px solid var(--line);border-radius:8px;background:var(--panel);color:var(--text);cursor:pointer;display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-height:54px;padding:8px 10px;text-align:left}.search-results button:disabled{cursor:default}.search-results button.is-added{opacity:.72;background:var(--panel-strong)}.search-results em{color:var(--accent);font-size:12px;font-style:normal;font-weight:700}.search-results small,.zone-meta,.zone-date,.modal-card small,.modal-card p,.empty-result{color:var(--muted)}.timezone-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:10px}.zone-card{position:relative;border:1px solid var(--line);border-radius:8px;background:var(--panel);box-shadow:var(--shadow);min-height:108px;padding:12px;overflow:hidden}.zone-card.is-pinned{background:var(--panel-strong);border-color:color-mix(in srgb,var(--accent) 45%,var(--line))}.zone-card.is-pinned:before{content:"";position:absolute;inset:0 auto 0 0;width:5px;background:var(--accent)}.card-main{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:14px;min-width:0;padding-left:2px}.zone-title{display:flex;align-items:center;gap:8px;min-width:0;font-weight:750}.zone-title span:first-child,.zone-meta{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pin-marker{flex:0 0 auto;width:8px;height:8px;border-radius:999px;background:var(--accent);box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 16%,transparent)}.zone-meta{margin-top:2px;font-size:12px}.zone-time{font-size:29px;font-weight:800;font-variant-numeric:tabular-nums;line-height:1;text-align:right;white-space:nowrap}.zone-date{margin-top:5px;font-size:13px}.card-side{display:grid;justify-items:end;gap:12px}.card-actions{display:flex;gap:6px}.card-actions .icon-button{width:34px;min-height:34px}.modal{width:min(520px,calc(100% - 24px));border:0;border-radius:8px;padding:0;background:transparent;color:var(--text)}.modal::backdrop{background:#00000094}.modal-card{display:grid;gap:14px;border:1px solid var(--line);border-radius:8px;background:var(--panel);box-shadow:var(--shadow);padding:18px}.modal-card header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.modal-card h2{font-size:18px}.modal-card label{display:grid;gap:6px}.time-picker-row{display:grid;grid-template-columns:1fr 48px;align-items:center;gap:8px}.day-shift{color:var(--accent);font-size:14px;min-height:20px;text-align:left}.modal-card textarea{min-height:104px;resize:vertical}.share-modal canvas{justify-self:center;border-radius:8px;background:#fff;padding:8px}@media(max-width:980px){.shell{width:min(100% - 20px,1180px);padding:18px 0}.topbar{align-items:flex-start;flex-direction:column;gap:12px}.timezone-grid{grid-template-columns:1fr}.zone-card{min-height:0;padding:12px}.card-actions .icon-button{width:34px;min-height:34px}.card-main{grid-template-columns:minmax(0,1fr) auto;gap:14px;padding-left:0}.zone-time{font-size:32px}.zone-title{font-size:24px;line-height:1.1}.zone-meta{margin-top:6px;font-size:17px}.zone-date{margin-top:8px;font-size:17px}}@media(max-width:500px){.shell{width:min(100% - 16px,1180px);padding:14px 0}.eyebrow{font-size:10px;letter-spacing:.16em}h1{font-size:26px}.topbar p{font-size:12px}.top-actions{width:100%;flex-wrap:wrap}.button,.icon-button{min-height:34px}.button{padding:0 12px}.icon-button{width:34px;font-size:16px}.timezone-grid{grid-template-columns:1fr;gap:8px}.zone-card{padding:9px}.card-main{gap:8px}.card-actions{gap:4px}.card-side{gap:7px}.card-actions .icon-button{width:30px;min-height:30px}.zone-time{font-size:23px}.zone-title{font-size:17px}.zone-date{margin-top:5px;font-size:12px}.zone-meta{margin-top:3px;font-size:12px}.clock-icon{width:16px;height:16px}}@media(max-width:380px){.zone-card{padding:8px}.zone-time{font-size:21px}.card-actions .icon-button{width:28px;min-height:28px}}