:root{
  --bg:#02091F;--panel:#071631;--button:#0A1C3D;--dialog:#06142F;--input:#0D2447;
  --title:#D8E4F5;--buttonText:#C4D3E8;--cardTitle:#CFDCF0;--code:#8BCBFA;--meta:#879AB8;
  --date:#94A7C2;--footer:#768AA8;--focus:#16B8EF;--focusText:#03111F;--progress:#6F57FC;
  --track:#132A55;--icon:#7ED8FF;--faviconFrame:#3156B5;--faviconPlate:#D8DDE8;
  --danger:#D96A77;--shadow:0 22px 70px rgba(0,0,0,.28);--radius:18px;
}
html[data-theme="Graphite"]{--bg:#0B0D10;--panel:#171A1F;--button:#1D2127;--dialog:#15191F;--input:#252B33;--title:#D8DDE3;--buttonText:#C9CFD7;--cardTitle:#D2D7DE;--code:#C2D4E3;--meta:#929CA8;--date:#98A2AD;--footer:#7F8995;--focus:#65AFCB;--focusText:#0A1419;--progress:#52A6C4;--track:#2B3139;--icon:#BFCBD5;--faviconFrame:#343B45;--faviconPlate:#D9DDE2}
html[data-theme="Neon Blue"]{--bg:#030A12;--panel:#0A1621;--button:#0D1D2B;--dialog:#081521;--input:#10293A;--title:#CBE0ED;--buttonText:#BBD4E2;--cardTitle:#C7DBE7;--code:#6FC6E6;--meta:#7FA4B5;--date:#86A9B9;--footer:#708D9B;--focus:#27A5CC;--focusText:#03131A;--progress:#2199BF;--track:#153241;--icon:#87C8DD;--faviconFrame:#1A3C4D;--faviconPlate:#D4DBDF}
html[data-theme="Violet"]{--bg:#0A0810;--panel:#171321;--button:#20182D;--dialog:#161121;--input:#2B213B;--title:#DED6EA;--buttonText:#CEC4DC;--cardTitle:#D8D0E3;--code:#C2B4E8;--meta:#9B8EAE;--date:#A094B3;--footer:#887B9C;--focus:#8E76D0;--focusText:#130D21;--progress:#7E68C2;--track:#332847;--icon:#C7BBE5;--faviconFrame:#3A2F4D;--faviconPlate:#DCD8E1}

html[data-theme="Elite"]{--bg:#010603;--panel:#041008;--button:#07170C;--dialog:#031007;--input:#092010;--title:#B8F6C5;--buttonText:#A8E9B7;--cardTitle:#B2EFBE;--code:#52FF84;--meta:#78B88A;--date:#86C797;--footer:#60986F;--focus:#39FF6A;--focusText:#001A08;--progress:#19E95A;--track:#0A2D15;--icon:#6EFF91;--faviconFrame:#15582A;--faviconPlate:#CFDAD2;--danger:#DF6875;--shadow:0 22px 70px rgba(0,0,0,.42)}
html[data-theme="Black"]{--bg:#000000;--panel:#050608;--button:#0A0C10;--dialog:#050609;--input:#0D1015;--title:#D7DEE8;--buttonText:#BCC6D3;--cardTitle:#CAD4E0;--code:#77C8FF;--meta:#748194;--date:#8895A5;--footer:#626F7F;--focus:#2F9BFF;--focusText:#02060A;--progress:#6B5CFF;--track:#111824;--icon:#75C8FF;--faviconFrame:#1E334D;--faviconPlate:#CBD2DA;--danger:#D96370;--shadow:0 22px 72px rgba(0,0,0,.62)}
html[data-theme="Pink Nova"]{--bg:#110713;--panel:#211026;--button:#2B1332;--dialog:#1C0C21;--input:#35173D;--title:#F1D4EC;--buttonText:#E5C0DD;--cardTitle:#EACBE5;--code:#FF93D5;--meta:#BA8DAE;--date:#C29AB8;--footer:#9E7898;--focus:#FF63C3;--focusText:#210517;--progress:#C06CFF;--track:#46224C;--icon:#FFA0DD;--faviconFrame:#6C315F;--faviconPlate:#E5D7E2;--danger:#F0778C;--shadow:0 22px 70px rgba(0,0,0,.38)}
html[data-theme="Ember"]{--bg:#100906;--panel:#21140F;--button:#2A1912;--dialog:#20120D;--input:#3A2419;--title:#E4D7CC;--buttonText:#D8C6B7;--cardTitle:#DFD1C5;--code:#E9A96E;--meta:#AD907D;--date:#B59A87;--footer:#987C6B;--focus:#D77B3F;--focusText:#1C0D05;--progress:#C96D32;--track:#472B1E;--icon:#E1B78F;--faviconFrame:#513322;--faviconPlate:#DED8D2}
html[data-theme="Daylight"]{--bg:#E3E7EB;--panel:#D4D9DF;--button:#CBD2D9;--dialog:#D9DEE3;--input:#BEC7D0;--title:#2C3742;--buttonText:#34414D;--cardTitle:#303C47;--code:#2D648E;--meta:#5E6C79;--date:#5A6976;--footer:#697783;--focus:#477FA9;--focusText:#E0E7ED;--progress:#477FA9;--track:#B7C1CB;--icon:#527A98;--faviconFrame:#AAB5BF;--faviconPlate:#E0E4E8;--danger:#A44752;--shadow:0 18px 55px rgba(34,49,62,.16)}
*{box-sizing:border-box}*[hidden]{display:none!important}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--title);font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;-webkit-font-smoothing:antialiased;text-rendering:auto;font-kerning:normal;font-synthesis:none}body{min-height:100vh;min-height:100svh}button,input,select{font:inherit}button,a,input,select{outline:none}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{box-shadow:0 0 0 3px color-mix(in srgb,var(--focus) 72%,transparent)}button{border:1px solid color-mix(in srgb,var(--focus) 10%,transparent);background:var(--button);color:var(--buttonText);border-radius:12px;min-height:48px;padding:0 20px;font-weight:600;cursor:pointer;transition:transform .16s ease,border-color .16s ease,background .16s ease,color .16s ease}button:hover{border-color:color-mix(in srgb,var(--focus) 55%,transparent)}button:active{transform:translateY(1px)}button.primary{background:var(--focus);color:var(--focusText);border-color:var(--focus)}button.quiet{background:transparent;border-color:color-mix(in srgb,var(--meta) 28%,transparent);color:var(--meta)}button.danger{color:var(--danger)}button.wide{width:100%}.landing{overflow:hidden;background:radial-gradient(circle at 50% 43%,color-mix(in srgb,var(--focus) 7%,transparent),transparent 44%),var(--bg)}.landing-header{height:92px;display:flex;justify-content:flex-end;align-items:center;padding:env(safe-area-inset-top) max(28px,env(safe-area-inset-right)) 0}.login-button{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 24px;border:1px solid color-mix(in srgb,var(--focus) 38%,transparent);border-radius:12px;color:var(--buttonText);text-decoration:none;background:var(--button);font-weight:600}.landing-main{height:calc(100svh - 92px);display:grid;place-items:center;padding:24px}.landing-wordmark{font-size:clamp(42px,8vw,92px);font-weight:600;letter-spacing:-.045em;color:var(--title);text-align:center}.auth-page{display:grid;place-items:center;padding:40px 20px;background:radial-gradient(circle at 50% 25%,color-mix(in srgb,var(--focus) 8%,transparent),transparent 40%),var(--bg)}.auth-shell{width:min(100%,520px)}.brand-small{display:inline-block;margin:0 0 22px;color:var(--title);text-decoration:none;font-size:20px;font-weight:700}.login-card{background:var(--dialog);border:1px solid color-mix(in srgb,var(--focus) 20%,transparent);border-radius:22px;padding:34px;box-shadow:var(--shadow)}.eyebrow{text-transform:uppercase;letter-spacing:.12em;font-size:12px;font-weight:700;color:var(--focus);margin-bottom:8px}.login-card h1{font-size:40px;letter-spacing:-.03em;margin:0 0 12px}.login-card p{color:var(--meta);line-height:1.55}.login-card label,.form-grid label{display:block;color:var(--meta);font-size:13px;font-weight:700;margin:18px 0 8px}.login-card input,.form-grid input,.form-grid select,.search-row input{width:100%;min-height:52px;border:1px solid color-mix(in srgb,var(--meta) 30%,transparent);border-radius:12px;background:var(--input);color:var(--title);padding:0 15px}.login-card input{font-size:20px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:16px}.alert{padding:12px 14px;border-radius:10px;margin:16px 0;font-size:14px}.alert.error{background:color-mix(in srgb,var(--danger) 14%,transparent);color:var(--danger);border:1px solid color-mix(in srgb,var(--danger) 34%,transparent)}.fineprint{font-size:12px!important;color:var(--footer)!important}.app-body{background:var(--bg);min-height:100svh;padding-bottom:72px}.app-header{position:sticky;top:0;z-index:20;padding:30px clamp(24px,3.9vw,75px) 14px;background:linear-gradient(to bottom,var(--bg) 82%,color-mix(in srgb,var(--bg) 0%,transparent));backdrop-filter:blur(10px)}.header-top{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:54px}.app-title{font-size:clamp(32px,2.5vw,44px);line-height:1.05;font-weight:700;letter-spacing:-.028em;color:var(--title)}.web-clock{color:var(--date);font-size:15px;font-variant-numeric:tabular-nums;letter-spacing:.01em;white-space:nowrap}.header-actions{display:flex;gap:12px;flex-wrap:wrap;justify-content:flex-start;margin-top:24px}.header-actions button{min-width:150px}.search-row{padding:0 clamp(24px,3.9vw,75px) 12px;display:flex;gap:10px}.search-row[hidden]{display:none}.search-row input{max-width:520px}.app-main{padding:8px clamp(24px,3.9vw,75px) 70px}.code-grid{display:grid;grid-template-columns:repeat(4,minmax(240px,420px));column-gap:30px;row-gap:14px;max-width:1770px;margin:0;justify-content:start;align-items:start}.code-card{position:relative;min-height:252px;border-radius:var(--radius);background:var(--panel);border:1px solid color-mix(in srgb,var(--meta) 13%,transparent);overflow:hidden;cursor:pointer;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}.code-card:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--focus) 45%,transparent);box-shadow:0 12px 35px rgba(0,0,0,.13)}.card-accent{position:absolute;inset:0 auto 0 0;width:5px;background:var(--accent,var(--focus))}.card-inner{height:100%;min-height:252px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:22px 18px 20px;gap:7px}.icon-wrap{width:68px;height:68px;display:grid;place-items:center;margin-bottom:2px}.icon-wrap.favicon{background:var(--faviconPlate);border:1px solid var(--faviconFrame);border-radius:13px;padding:7px}.icon-wrap img{display:block;max-width:100%;max-height:100%;object-fit:contain}.icon-wrap.stock img{filter:var(--stock-filter,none);opacity:.92}.icon-wrap.brand img,.full-icon.brand img{filter:none!important;opacity:1!important}.card-title{font-size:22px;line-height:1.16;font-weight:700;color:var(--cardTitle);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.card-account{min-height:21px;max-width:100%;font-size:15px;color:var(--meta);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.card-code{font-variant-numeric:tabular-nums;font-size:clamp(31px,2.25vw,40px);line-height:1.05;font-weight:700;letter-spacing:.025em;color:var(--code);margin-top:3px}.card-next{font-variant-numeric:tabular-nums;font-size:14px;color:var(--meta);opacity:.78}.progress-track{position:absolute;left:16px;right:16px;bottom:10px;height:5px;border-radius:999px;background:var(--track);overflow:hidden}.progress-value{height:100%;width:100%;background:var(--progress);transform-origin:left center;will-change:transform}.empty-state{min-height:52vh;display:grid;place-items:center;text-align:center;color:var(--meta)}.empty-state h2{font-size:clamp(24px,3vw,38px);font-weight:600;letter-spacing:-.015em}.search-empty{min-height:28vh}.search-empty h2{font-size:clamp(20px,2.2vw,30px);color:var(--footer)}.app-footer{position:fixed;left:0;right:0;bottom:0;z-index:15;display:flex;justify-content:center;gap:34px;padding:14px 24px calc(14px + env(safe-area-inset-bottom));background:color-mix(in srgb,var(--bg) 94%,transparent);border-top:1px solid color-mix(in srgb,var(--meta) 12%,transparent);color:var(--footer);font-size:13px;backdrop-filter:blur(12px)}.modal-backdrop{position:fixed;inset:0;z-index:100;background:rgba(0,0,0,.64);display:grid;place-items:center;padding:20px;animation:fadeIn .16s ease}.modal{width:min(100%,680px);max-height:min(90svh,920px);overflow:auto;background:var(--dialog);border:1px solid color-mix(in srgb,var(--focus) 22%,transparent);border-radius:22px;box-shadow:var(--shadow);padding:26px}.modal.large{width:min(100%,900px)}.modal.full-card{width:min(100%,1080px);min-height:min(74svh,720px);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:42px}.modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:18px}.modal h2{margin:0;color:var(--title);font-size:28px;letter-spacing:-.02em}.modal p{color:var(--meta);line-height:1.55}.modal-actions{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap;margin-top:24px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}.form-grid .span-2{grid-column:1/-1}.help{font-size:12px;color:var(--footer);margin-top:6px}.full-icon{width:142px;height:142px;display:grid;place-items:center;margin-bottom:22px}.full-icon.favicon{background:var(--faviconPlate);border:2px solid var(--faviconFrame);border-radius:22px;padding:14px}.full-icon img{max-width:100%;max-height:100%;object-fit:contain}.full-title{font-size:clamp(34px,5vw,56px);font-weight:700;color:var(--cardTitle);max-width:90%;overflow-wrap:anywhere}.full-account{font-size:clamp(20px,2.4vw,30px);color:var(--meta);margin-top:8px;max-width:90%;overflow-wrap:anywhere}.full-code{font-variant-numeric:tabular-nums;font-size:clamp(62px,8vw,104px);font-weight:700;letter-spacing:.055em;color:var(--code);margin-top:34px;transition:opacity .16s ease,transform .16s ease}.full-code.switching{opacity:0;transform:translateY(5px)}.full-next{font-variant-numeric:tabular-nums;color:var(--meta);font-size:clamp(18px,2.2vw,28px);opacity:.68;margin-top:12px}.full-progress{position:relative;width:min(88%,780px);height:7px;background:var(--track);border-radius:99px;overflow:hidden;margin-top:34px}.full-progress>div{height:100%;background:var(--progress);transform-origin:left center}.full-toolbar{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:30px}.settings-section{border-top:1px solid color-mix(in srgb,var(--meta) 16%,transparent);padding-top:22px;margin-top:24px}.settings-section:first-of-type{border-top:0;padding-top:0}.settings-section h3{margin:0 0 14px;line-height:1.25}.settings-row{display:flex;align-items:center;justify-content:space-between;gap:28px;padding:18px 0}.settings-row>div:first-child{min-width:0;display:flex;flex:1 1 auto;flex-direction:column;align-items:flex-start;gap:6px}.settings-row strong{display:block;color:var(--cardTitle);line-height:1.3}.settings-row span{display:block;color:var(--meta);font-size:13px;line-height:1.45}.settings-row>button{flex:0 0 auto;min-width:154px}.theme-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.theme-choice{min-height:60px}.theme-choice.active{border-color:var(--focus);box-shadow:inset 0 0 0 1px var(--focus)}.device-list{display:grid;gap:10px;margin-top:12px}.device-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px;background:var(--panel);border-radius:12px;border:1px solid color-mix(in srgb,var(--meta) 12%,transparent)}.device-meta{min-width:0}.device-meta strong,.device-meta span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.device-meta span{color:var(--meta);font-size:12px;margin-top:3px}.toast{position:fixed;left:50%;bottom:88px;z-index:200;transform:translateX(-50%);padding:12px 18px;border-radius:12px;background:var(--title);color:var(--focusText);font-weight:600;box-shadow:var(--shadow)}.toast[hidden]{display:none}.danger-note{border:1px solid color-mix(in srgb,var(--danger) 34%,transparent);background:color-mix(in srgb,var(--danger) 10%,transparent);color:var(--meta);padding:13px;border-radius:12px;font-size:13px;line-height:1.5}.hidden-code{letter-spacing:.08em}@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@media(max-width:1250px){.code-grid{grid-template-columns:repeat(3,minmax(220px,1fr));max-width:none}}
@media(max-width:900px){.header-top{align-items:flex-start}.header-actions{justify-content:flex-start;width:100%}.header-actions button{min-width:0}.code-grid{grid-template-columns:repeat(2,minmax(0,1fr));max-width:none}.app-footer{display:none}.app-body{padding-bottom:20px}.form-grid{grid-template-columns:1fr}.form-grid .span-2{grid-column:auto}.theme-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.landing-header{height:76px;padding-left:18px;padding-right:18px}.landing-main{height:calc(100svh - 76px)}.login-card{padding:24px}.app-header{padding:20px 16px 12px}.header-top{min-height:44px}.app-title{font-size:31px}.web-clock{font-size:13px}.header-actions{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:18px}.header-actions button{padding:0 10px}.app-main,.search-row{padding-left:16px;padding-right:16px}.code-grid{grid-template-columns:1fr;gap:14px}.code-card,.card-inner{min-height:242px}.modal-backdrop{padding:10px}.modal{padding:20px;border-radius:18px;max-height:94svh}.modal.full-card{padding:28px 18px;min-height:86svh}.full-icon{width:118px;height:118px}.full-code{margin-top:28px}.theme-grid{grid-template-columns:1fr}.settings-row{align-items:stretch;flex-direction:column;gap:12px;padding:16px 0}.settings-row>button{width:100%}.device-row{align-items:flex-start;flex-direction:column}.device-row button{width:100%}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}


/* Web-only compact display mode. Standard remains the default. */
.app-body.compact-mode .code-grid{
  grid-template-columns:repeat(5,minmax(260px,330px));
  column-gap:18px;
  row-gap:12px;
  max-width:1722px;
}
.app-body.compact-mode .code-card{min-height:154px;border-radius:14px}
.app-body.compact-mode .card-inner{
  min-height:154px;
  display:grid;
  grid-template-columns:50px minmax(0,1fr);
  grid-template-rows:auto auto auto auto;
  align-content:center;
  align-items:center;
  justify-items:start;
  column-gap:12px;
  row-gap:2px;
  padding:14px 48px 20px 17px;
}
.app-body.compact-mode .icon-wrap{
  grid-column:1;
  grid-row:1/3;
  width:48px;
  height:48px;
  margin:0;
  align-self:center;
}
.app-body.compact-mode .icon-wrap.favicon{border-radius:10px;padding:5px}
.app-body.compact-mode .card-title{
  grid-column:2;
  grid-row:1;
  align-self:end;
  width:100%;
  font-size:17px;
  line-height:1.15;
}
.app-body.compact-mode .card-account{
  grid-column:2;
  grid-row:2;
  align-self:start;
  min-height:17px;
  width:100%;
  font-size:12.5px;
  line-height:1.25;
}
.app-body.compact-mode .card-code{
  grid-column:1/-1;
  grid-row:3;
  justify-self:start;
  font-size:28px;
  line-height:1.05;
  margin-top:9px;
}
.app-body.compact-mode .card-next{
  grid-column:1/-1;
  grid-row:4;
  justify-self:start;
  font-size:12px;
  line-height:1.2;
  margin-top:2px;
}
.app-body.compact-mode .progress-track{left:12px;right:12px;bottom:8px;height:4px}
.app-body.compact-mode .card-actions{
  top:7px!important;
  right:7px!important;
  min-height:30px!important;
  padding:0 8px!important;
  font-size:12px;
}
@media(max-width:1500px){.app-body.compact-mode .code-grid{grid-template-columns:repeat(4,minmax(250px,1fr));max-width:none}}
@media(max-width:1150px){.app-body.compact-mode .code-grid{grid-template-columns:repeat(3,minmax(235px,1fr))}}
@media(max-width:820px){.app-body.compact-mode .code-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}}
@media(max-width:560px){
  .app-body.compact-mode .code-grid{grid-template-columns:1fr}
  .app-body.compact-mode .code-card,.app-body.compact-mode .card-inner{min-height:146px}
}

/* v1.0.4 mobile header/search polish */
@media(max-width:620px){
  .app-header{padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right))}
  .header-top{align-items:center;min-height:44px}
  .app-title{line-height:1}
  .web-clock{display:flex;align-items:center;line-height:1.2;min-height:31px}
  .search-row{position:relative;z-index:19;margin-top:2px;padding-top:10px;padding-bottom:12px;padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right));background:var(--bg)}
  .search-row input{min-width:0}
}