:root{--ink: #07131a;--foam: #d8efe6;--muted: #8fb3aa;--amber: #e4b56a;--tile: rgba(8, 28, 34, .62);--line: rgba(216, 239, 230, .14)}*{box-sizing:border-box}html,body,#root{margin:0;min-height:100%}body{font-family:Avenir Next,Segoe UI,sans-serif;color:var(--foam);background:radial-gradient(1100px 520px at 88% -8%,rgba(228,181,106,.2),transparent 58%),radial-gradient(900px 520px at -12% 108%,rgba(38,122,126,.38),transparent 52%),linear-gradient(165deg,#071018,#0c1d24 48%,#14363c)}.desktop{min-height:100vh;padding:40px 48px 88px;position:relative;overflow:hidden;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:72px 72px}.watermark{position:absolute;right:-24px;bottom:36px;font-size:120px;letter-spacing:.18em;font-weight:700;color:#d8efe60d;pointer-events:none;-webkit-user-select:none;user-select:none}.topbar{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:48px;position:relative;z-index:1}.brand{font-size:13px;letter-spacing:.28em;text-transform:uppercase;color:var(--amber)}.clock{font-variant-numeric:tabular-nums;color:var(--muted);font-size:14px}.grid{display:grid;grid-template-columns:repeat(auto-fill,108px);gap:28px 22px;position:relative;z-index:1}.tile{width:108px;border:0;background:transparent;color:inherit;cursor:pointer;text-align:center;padding:0;font:inherit}.glyph{height:88px;border-radius:22px;background:var(--tile);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-size:32px;font-weight:600;box-shadow:0 18px 40px #00000047;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.tile:hover .glyph{border-color:#e4b56a8c;transform:translateY(-2px)}.label{margin-top:10px;font-size:12px;color:var(--foam);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.actions{display:flex;justify-content:center;gap:8px;margin-top:6px;min-height:18px}.actions button{border:0;background:transparent;color:var(--muted);font-size:11px;cursor:pointer;padding:0}.actions button:hover{color:var(--amber)}.add .glyph{border-style:dashed;background:transparent;box-shadow:none;font-size:28px;color:var(--amber)}.empty{grid-column:1 / -1;color:var(--muted);font-size:14px}.error{position:relative;z-index:1;margin-bottom:24px;color:#ffb4a8}.error button{margin-left:12px;border:1px solid var(--line);background:transparent;color:var(--foam);border-radius:999px;padding:4px 12px;cursor:pointer}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#040a0e8c;display:flex;align-items:center;justify-content:center;z-index:10}.modal{width:min(420px,calc(100vw - 32px));background:#10242b;border:1px solid var(--line);border-radius:20px;padding:24px;box-shadow:0 24px 60px #0006}.modal h2{margin:0 0 16px;font-size:16px}.modal label{display:block;font-size:12px;color:var(--muted);margin-bottom:12px}.modal input{width:100%;margin-top:6px;border:1px solid var(--line);background:#0b1a20;color:var(--foam);border-radius:10px;padding:10px 12px;font:inherit}.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:8px}.modal-actions button{border:0;border-radius:999px;padding:8px 14px;cursor:pointer;font:inherit}.modal-actions .ghost{background:transparent;color:var(--muted)}.modal-actions .primary{background:var(--amber);color:#1a1208}