:root{--ink:#2c2333;--muted:#665c6d;--paper:#f4eff5;--surface:rgba(255,255,255,.9);--strong:#fff;--line:rgba(54,38,64,.2);--accent:#795bd7;--accent2:#5d42b5;--shadow:0 20px 60px rgba(38,24,47,.14);font:16px/1.5 Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;color-scheme:light}
*{box-sizing:border-box}body{margin:0;color:var(--ink);background:#f4eff5}button,input,textarea,select{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer}button,input,textarea,select{min-height:44px}a{color:var(--accent2)}:focus-visible{outline:3px solid #ffbf47!important;outline-offset:3px;box-shadow:0 0 0 5px rgba(24,17,29,.72)!important}.primary{border:0;color:#fff;background:linear-gradient(135deg,var(--accent),var(--accent2));font-weight:800}.alert,.message{padding:12px 15px;border:1px solid #b5414d;border-radius:12px;color:#7b1823;background:#fff0f1;font-weight:700}.message.success{border-color:#4c6f9d;color:#173f70;background:#eaf3ff}
.auth-body{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 80% 8%,#d8c4ff,transparent 34%),linear-gradient(145deg,#faf5f1,#eee8f7)}.auth-card{width:min(460px,100%);padding:36px;border:1px solid var(--line);border-radius:24px;background:rgba(255,255,255,.94);box-shadow:var(--shadow)}.auth-brand{display:flex;align-items:center;gap:10px;color:var(--ink);text-decoration:none;font-weight:900}.auth-brand b,.logo{width:44px;height:44px;display:grid;place-items:center;border-radius:14px 14px 14px 5px;color:#fff;background:linear-gradient(145deg,var(--accent),var(--accent2));font:italic 800 24px Georgia,serif;text-decoration:none}.auth-card h1{margin:30px 0 4px;font:700 38px/1.1 Georgia,serif}.auth-card>p{color:var(--muted)}.auth-form,.modal{display:grid;gap:17px}.auth-form label,.modal label{display:grid;gap:7px;font-weight:750}.auth-form input,.modal input,.modal textarea,.modal select{width:100%;padding:10px 13px;border:1px solid var(--line);border-radius:11px;color:var(--ink);background:#fff;font-size:16px}.auth-form button{min-height:50px;border-radius:12px}.auth-switch{text-align:center;font-size:15px}
.app{min-height:100vh;--bg:radial-gradient(circle at 75% 5%,#cfb7ff,transparent 29%),linear-gradient(150deg,#f8f2ed,#eee9f7);background:var(--bg);background-attachment:fixed;background-position:center;background-size:cover}.bg-dusk{--bg:linear-gradient(145deg,#251b2e,#a45f56);--ink:#fff;--muted:#f2eaf4;--surface:rgba(34,24,42,.9);--strong:rgba(43,31,52,.97);--line:rgba(255,255,255,.35);color-scheme:dark}.bg-paper{--bg:linear-gradient(145deg,#f2e7d8,#fffaf4)}.bg-midnight{--bg:radial-gradient(circle at 75% 8%,#6a51aa,transparent 35%),#17121d;--ink:#fff;--muted:#eee7f2;--surface:rgba(30,23,37,.92);--strong:rgba(41,31,49,.98);--line:rgba(255,255,255,.36);color-scheme:dark}.bg-waves{--bg:radial-gradient(circle at 15% 5%,#72aec5,transparent 38%),linear-gradient(145deg,#e1f0f3,#eee5f7)}.bg-custom{--ink:#fff;--muted:#f4edf6;--surface:rgba(27,20,34,.9);--strong:rgba(39,29,47,.96);--line:rgba(255,255,255,.4);color-scheme:dark}.theme-ocean{--accent:#337cae;--accent2:#205d8b}.theme-sunset{--accent:#d7634f;--accent2:#a94335}.theme-berry{--accent:#a83f73;--accent2:#7d2851}.theme-graphite{--accent:#555d69;--accent2:#363c45}.tiles-solid .tile{background:var(--strong);backdrop-filter:none}.tiles-minimal .tile{border-color:transparent;background:color-mix(in srgb,var(--surface) 55%,transparent);box-shadow:none}
.rail{position:fixed;inset:0 auto 0 0;z-index:20;width:88px;padding:20px 12px;display:flex;align-items:center;flex-direction:column;color:#fff;background:linear-gradient(180deg,#30233a,#241a2b)}.rail nav{margin:auto 0;display:grid;gap:13px}.rail nav button{width:64px;min-height:62px;border:0;border-radius:14px;display:grid;place-items:center;gap:1px;color:#d8cddd;background:transparent}.rail nav button.active,.rail nav button:hover{color:#fff;background:var(--accent)}.rail nav b{font-size:22px}.rail nav span{font-size:12px;font-weight:800}.avatar{width:46px;height:46px;min-height:46px;border:2px solid rgba(255,255,255,.5);border-radius:14px;color:#fff;background:#c95e68;font-weight:900}.workspace{margin-left:88px}.topbar{height:78px;position:sticky;top:0;z-index:10;padding:0 34px;display:flex;align-items:center;gap:24px;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--surface) 90%,transparent);backdrop-filter:blur(18px)}.top-title{min-width:155px;display:grid}.top-title b{font-size:16px}.top-title span{color:var(--muted);font-size:12px}.filter{width:min(430px,42vw);display:flex;align-items:center;gap:10px;padding:0 14px;border:1px solid var(--line);border-radius:13px;background:var(--strong)}.filter input{min-width:0;width:100%;border:0;outline:0;color:var(--ink);background:transparent;font-size:16px}.top-actions{margin-left:auto;display:flex;gap:10px}.top-actions>button{padding:0 15px;border:1px solid var(--line);border-radius:12px;color:var(--ink);background:var(--strong);font-weight:750}.avatar.small{width:34px;height:34px;min-height:34px;margin-right:8px}.content{max-width:1500px;margin:auto;padding:0 34px 60px}.collection-tabs{margin:0 -34px;padding:12px 34px;display:flex;gap:7px;overflow:auto;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--surface) 70%,transparent)}.collection-tabs button{padding:0 14px;border:1px solid transparent;border-radius:11px;color:var(--muted);background:transparent;font-weight:750;white-space:nowrap}.collection-tabs button.active{color:#fff;background:var(--accent)}.collection-tabs b{margin-left:6px}.hero{max-width:820px;margin:54px auto 45px;text-align:center}.kicker,.eyebrow{color:var(--accent2);font-size:12px;font-weight:900;letter-spacing:1.5px}.hero h1{margin:10px 0 24px;font:600 clamp(40px,6vw,67px)/1.02 Georgia,serif;letter-spacing:-2px}.web-search{min-height:70px;padding:9px;display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:20px;background:var(--strong);box-shadow:var(--shadow)}.web-search>span{width:48px;height:48px;display:grid;place-items:center;border-radius:14px;color:#fff;background:var(--accent);font:700 20px Georgia,serif}.web-search input{min-width:0;flex:1;border:0;outline:0;color:var(--ink);background:transparent;font-size:18px}.web-search button{padding:0 20px;border:0;border-radius:14px;color:#fff;background:var(--accent);font-weight:850}.quick{margin-top:13px;display:flex;justify-content:center;gap:4px}.quick button{padding:0 13px;border:0;color:var(--muted);background:transparent;font-size:14px;font-weight:750}.dashboard{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:22px;align-items:start}.dial-panel,.packs{padding:25px;border:1px solid var(--line);border-radius:23px;background:color-mix(in srgb,var(--surface) 88%,transparent);box-shadow:var(--shadow);backdrop-filter:blur(18px)}.dial-panel>header,.packs>header{margin-bottom:20px;display:flex;align-items:end;justify-content:space-between;gap:16px}.dial-panel h2,.packs h2{margin:4px 0 0;font:600 27px Georgia,serif}.dial-panel header>div:last-child{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:13px}.dial-panel header button,.packs header button{padding:0 12px;border:0;border-radius:10px;color:#fff;background:var(--accent);font-weight:800}.dial{display:grid;grid-template-columns:repeat(4,minmax(135px,1fr));gap:14px}.tile{min-height:178px;position:relative;overflow:hidden;border:1px solid var(--line);border-radius:18px;color:var(--ink);background:var(--strong);box-shadow:0 9px 24px rgba(34,22,42,.1);transition:.2s}.tile:hover{transform:translateY(-4px);box-shadow:0 17px 35px rgba(34,22,42,.18)}.tile.cover{color:#fff;background-position:center;background-size:cover}.tile.cover:after{content:"";position:absolute;inset:0;background:linear-gradient(rgba(10,8,12,.3),rgba(10,8,12,.86))}.tile-menu,.tile-open{position:relative;z-index:2}.tile-menu{height:46px;padding:6px;display:flex;justify-content:space-between}.tile-menu button{width:44px;border:0;color:inherit;background:transparent;font-size:18px}.tile-open{width:100%;min-height:126px;padding:4px 14px 16px;border:0;display:flex;align-items:center;justify-content:center;flex-direction:column;color:inherit;background:transparent}.favicon{width:62px;height:62px;display:grid;place-items:center;overflow:hidden;border-radius:18px;background:rgba(255,255,255,.94)}.favicon img{width:38px;height:38px;object-fit:contain}.tile-open b{max-width:100%;margin-top:11px;overflow:hidden;font-size:16px;text-overflow:ellipsis;white-space:nowrap;text-shadow:0 1px 4px rgba(0,0,0,.3)}.tile-open small{max-width:100%;overflow:hidden;color:currentColor;font-size:12px;opacity:.9;text-overflow:ellipsis;white-space:nowrap}.add-tile{display:grid;place-items:center;border-style:dashed;color:var(--muted);background:transparent;font-size:15px;font-weight:800}.add-tile b{width:48px;height:48px;display:grid;place-items:center;border-radius:15px;color:#fff;background:var(--accent);font-size:25px}.empty{grid-column:1/-1;padding:70px 20px;text-align:center;color:var(--muted)}.empty b{display:block;color:var(--ink);font:600 24px Georgia,serif}.packs>header button{width:44px}.pack{min-height:68px;padding:8px;display:grid;grid-template-columns:46px minmax(0,1fr) 44px 44px;align-items:center;gap:7px;border-radius:14px}.pack:hover{background:var(--strong)}.pack-icon{width:46px;border:0;border-radius:13px;background:#eee7ff}.pack-name{min-width:0;border:0;display:grid;text-align:left;color:var(--ink);background:transparent}.pack-name b,.pack-name small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pack-name b{font-size:15px}.pack-name small{color:var(--muted);font-size:12px}.pack>button:last-child,.pack>button:nth-last-child(2){border:0;color:var(--muted);background:transparent}
dialog{width:min(650px,calc(100% - 28px));max-height:90vh;padding:0;border:0;border-radius:23px;color:var(--ink);background:var(--strong);box-shadow:0 30px 100px rgba(14,9,18,.45)}dialog::backdrop{background:rgba(20,13,24,.67);backdrop-filter:blur(5px)}.modal{padding:30px;overflow:auto}.modal.wide{width:100%}.modal.compact{max-width:500px}.modal h2{margin:0;font:600 30px Georgia,serif}.modal>p{margin:-12px 0 4px;color:var(--muted)}.close{width:44px;position:absolute;right:16px;top:14px;border:0;border-radius:11px;color:var(--muted);background:transparent;font-size:26px}.modal textarea{min-height:90px;resize:vertical}.modal label small{color:var(--muted);font-weight:500}.modal fieldset{padding:14px;border:1px solid var(--line);border-radius:14px}.modal legend{padding:0 8px;font-weight:850}.choices{display:flex;flex-wrap:wrap;gap:8px}.choices label{display:block}.choices input{position:absolute;opacity:0;pointer-events:none}.choices span{min-height:44px;padding:9px 13px;display:grid;place-items:center;border:1px solid var(--line);border-radius:10px;background:var(--paper);font-size:13px}.choices input:checked+span{border-color:var(--accent);color:var(--accent2);box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 28%,transparent)}.color-choices span:before{content:"";width:18px;height:18px;margin-right:6px;display:inline-block;border-radius:50%;vertical-align:middle;background:#8d70df}.color-choices .coral:before{background:#db6e62}.color-choices .amber:before{background:#d89b39}.color-choices .sky:before{background:#4f8fbe}.color-choices .rose:before{background:#b8547c}.color-choices .slate:before{background:#73737e}.check{display:flex!important;align-items:center;grid-template-columns:44px 1fr!important}.check input{width:24px;height:24px;min-height:auto}.modal-actions{display:flex;justify-content:flex-end;gap:9px}.modal-actions button,.profile-footer>button{padding:0 17px;border:1px solid var(--line);border-radius:11px;background:var(--paper);font-weight:800}.modal-actions .primary{border:0;background:linear-gradient(135deg,var(--accent),var(--accent2))}.modal-actions .danger{margin-right:auto;color:#fff;background:#a92f3b;border-color:#a92f3b}.lock{width:60px;height:60px;display:grid;place-items:center;border-radius:18px;color:#fff;background:var(--accent);font-size:26px}.security{padding:13px;border:1px solid var(--line);border-radius:12px;color:var(--muted);background:var(--paper);font-size:14px}.upload{padding:14px;margin-top:10px;border:1px dashed var(--line);border-radius:12px}.profile-footer{display:flex;align-items:center;justify-content:space-between;gap:12px}.profile-footer .modal-actions{margin-left:auto}
@media(max-width:1150px){.dial{grid-template-columns:repeat(3,minmax(135px,1fr))}.dashboard{grid-template-columns:1fr}.packs #packList{display:grid;grid-template-columns:repeat(2,1fr)}}@media(max-width:720px){.rail{width:100%;height:68px;inset:auto 0 0;flex-direction:row;padding:7px 14px}.rail .logo{display:none}.rail nav{margin:0 auto;display:flex}.rail nav button{width:78px;min-height:54px}.workspace{margin-left:0;padding-bottom:72px}.topbar{height:68px;padding:0 14px}.top-title,.top-actions>button:first-child,#profileChip b{display:none}.filter{width:100%}.content{padding:0 14px 35px}.collection-tabs{margin:0 -14px;padding:10px 14px}.hero{margin:38px auto}.hero h1{font-size:42px}.web-search{min-height:62px}.web-search button{font-size:0}.web-search button:after{content:"↗";font-size:18px}.dashboard{display:block}.packs{margin-top:16px}.packs #packList{grid-template-columns:1fr}.dial-panel{padding:17px}.dial{grid-template-columns:repeat(2,minmax(125px,1fr));gap:10px}.tile{min-height:165px}.modal{padding:26px 18px}.profile-footer{align-items:stretch;flex-direction:column}.profile-footer .modal-actions{margin:0}}
@media(prefers-contrast:more){:root{--line:currentColor}.dial-panel,.packs,.tile,.modal input,.modal textarea,.modal select{border-width:2px}}@media(forced-colors:active){.tile.cover{background-image:none!important}.tile.cover:after{display:none}}

/* Refined UX scale and richer appearance controls */
.rail nav span,.top-title span{font-size:13px}.hero{margin:46px auto 38px}.hero h1{font-size:clamp(36px,5vw,54px);line-height:1.06;letter-spacing:-1.5px}.web-search input{font-size:16px}.quick button,.dial-panel header>div:last-child,.choices span,.modal label,.modal legend{font-size:14px}.tile-open b,.pack-name b{font-size:15px}.tile-open small,.pack-name small,.modal label small,.tile-colour p{font-size:13px;line-height:1.45}.modal h2{font-size:28px}.dial-panel h2,.packs h2{font-size:25px}.sr-only{width:1px;height:1px;position:absolute;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;clip-path:inset(50%)}

/* Hidden vault has an unmistakable, independent visual mode */
.scope-hidden{--accent:#d15b7d;--accent2:#9b3152;--ink:#fff;--muted:#f5dce6;--surface:rgba(52,19,36,.9);--strong:rgba(67,24,44,.96);--line:rgba(255,225,236,.36);background-image:radial-gradient(circle at 72% 4%,rgba(216,93,131,.56),transparent 31%),linear-gradient(145deg,#24121f,#5c203b)!important;color-scheme:dark}.scope-hidden .rail{background:linear-gradient(180deg,#4b1830,#28101f)}.scope-hidden .logo,.scope-hidden .avatar{background:linear-gradient(145deg,#e16c8d,#9b3152)}.scope-hidden .kicker,.scope-hidden .eyebrow{color:#ffd8e5}.scope-hidden .hero h1{text-shadow:0 2px 12px rgba(0,0,0,.42)}.vault-mode{margin:22px 0 0;padding:15px 17px;display:flex;align-items:center;gap:13px;border:1px solid rgba(255,214,229,.42);border-radius:16px;color:#fff;background:linear-gradient(120deg,rgba(126,35,68,.94),rgba(80,25,48,.94));box-shadow:0 14px 35px rgba(38,9,23,.28)}.vault-mode[hidden]{display:none}.vault-mode-icon{width:44px;height:44px;flex:0 0 auto;display:grid;place-items:center;border-radius:13px;background:#f4c6d6;color:#6d1d3c;font-size:22px;font-weight:900}.vault-mode div{min-width:0;display:grid;gap:2px}.vault-mode b{font-size:16px}.vault-mode small{color:#ffe9f0;font-size:13px}.vault-mode button{margin-left:auto;padding:0 15px;border:1px solid rgba(255,255,255,.55);border-radius:11px;color:#fff;background:rgba(255,255,255,.1);font-size:14px;font-weight:800}

/* Visual accent and background previews */
.appearance-choices{display:grid;grid-template-columns:repeat(5,minmax(92px,1fr))}.appearance-choices label{min-width:0}.appearance-choices span{min-height:88px;padding:8px;display:flex;align-items:stretch;justify-content:center;flex-direction:column;gap:7px;background:var(--paper)}.appearance-choices span i{width:100%;height:42px;display:block;border-radius:8px;background:var(--choice,#795bd7)}.appearance-choices span b{font-size:13px}.appearance-choices .accent-orchid{--choice:linear-gradient(135deg,#9278e8,#6548be)}.appearance-choices .accent-ocean{--choice:linear-gradient(135deg,#4d98c8,#1e5f91)}.appearance-choices .accent-sunset{--choice:linear-gradient(135deg,#ed806a,#b74637)}.appearance-choices .accent-berry{--choice:linear-gradient(135deg,#ca5d91,#7e2852)}.appearance-choices .accent-graphite{--choice:linear-gradient(135deg,#747c88,#363c45)}.background-choices span i{height:54px}.background-choices .preview-aurora i{background:radial-gradient(circle at 75% 10%,#b894f2,transparent 43%),linear-gradient(145deg,#eee8f7,#fae9e2)}.background-choices .preview-dusk i{background:linear-gradient(145deg,#2c2035,#bd6e62)}.background-choices .preview-paper i{background:linear-gradient(145deg,#eee2d4,#fffaf4)}.background-choices .preview-midnight i{background:radial-gradient(circle at 70% 18%,#725ab0,transparent 42%),#19141f}.background-choices .preview-waves i{background:radial-gradient(circle at 18% 8%,#66a6bd,transparent 42%),linear-gradient(145deg,#dcecef,#eee4f8)}.choices input:focus-visible+span{outline:3px solid #ffbf47;outline-offset:3px;box-shadow:0 0 0 5px rgba(24,17,29,.42)}

/* Per-dial image-only and solid-colour modes */
.feature-toggle{padding:13px;border:1px solid var(--line);border-radius:12px;background:var(--paper)}.feature-toggle>span{display:grid;gap:2px}.feature-toggle small{display:block}.feature-toggle.disabled{opacity:.58}.feature-toggle.disabled input{cursor:not-allowed}.tile-colour p{margin:-2px 0 10px;color:var(--muted)}.tile-colour-choices span{min-width:94px;display:flex;align-items:center;justify-content:flex-start;grid-template-columns:none}.tile-colour-choices span:before{content:"";width:24px;height:24px;flex:0 0 auto;margin-right:7px;border:1px solid rgba(30,22,35,.18);border-radius:7px;background:var(--tile-choice,linear-gradient(135deg,var(--strong),var(--paper)))}.tile-colour-choices .tile-auto:before{background:linear-gradient(135deg,#fff 0 45%,#d7c8eb 45% 55%,#2f2636 55%)}.tile.custom-color{color:#2c2333;background-image:none}.tile.custom-color .tile-open small{color:#51485a}.tile.image-only:after{background:linear-gradient(180deg,rgba(7,5,9,.48),transparent 42%)}.tile.image-only .tile-open{min-height:132px}.tile.image-only .tile-menu{opacity:.82;transition:opacity .18s}.tile.image-only:hover .tile-menu,.tile.image-only:focus-within .tile-menu{opacity:1}

@media(max-width:720px){.hero h1{font-size:38px}.appearance-choices{grid-template-columns:repeat(2,minmax(112px,1fr))}.vault-mode{align-items:flex-start}.vault-mode button{min-width:92px}.tile-colour-choices span{min-width:112px}}