/* Photoz web app — "matte paper and the red dot" (DESIGN.md, light default)
   and "the matte rangefinder" (dark). Mock: .impeccable/mocks/desktop-web/layout-v5.html */
@font-face{font-family:Manrope;font-style:normal;font-weight:200 800;font-display:swap;src:url(fonts/manrope-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:Manrope;font-style:normal;font-weight:200 800;font-display:swap;src:url(fonts/manrope-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  color-scheme:light;
  --ground:#F4F4F4;--tile:#E8E8E8;--hairline:#E0E0E0;--rule:#D3D3D3;--chip:#BDBDBD;
  --text:#111111;--text2:#707070;--red:#D8322A;--onred:#FFFFFF;--menu:#FFFFFF;--veil:rgba(0,0,0,.55);
  --font:Manrope,"Pretendard Variable","Pretendard JP Variable",Pretendard,-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Hiragino Sans","PingFang SC","Microsoft YaHei","Malgun Gothic","Noto Sans CJK KR",system-ui,sans-serif;
  --hdr:56px;
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --ground:#0B0B0B;--tile:#141414;--hairline:#1F1F1F;--rule:#2A2A2A;--chip:#3A3A3A;
  --text:#F2F2F2;--text2:#8A8A8A;--menu:#1A1A1A;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ground);color:var(--text);font:400 15px/1.45 var(--font);font-feature-settings:"tnum";word-break:keep-all;overflow-wrap:anywhere;min-height:100vh;display:flex;flex-direction:column}
a{color:inherit}
img{-webkit-user-drag:none;user-select:none}
button,input,select{font:inherit;color:inherit}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.icon{width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex:none}
[hidden]{display:none!important}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:12px;top:-60px;z-index:60;background:var(--text);color:var(--ground);padding:8px 12px;border-radius:6px;text-decoration:none;font-weight:600}
.skip:focus{top:8px}
:focus-visible{outline:2px solid var(--text);outline-offset:2px}

/* header */
.hdr{position:sticky;top:0;z-index:30;height:var(--hdr);display:flex;align-items:center;gap:8px;padding:0 20px;background:var(--ground);border-bottom:1px solid var(--hairline)}
.logo{display:flex;align-items:center;height:32px;margin-right:8px;text-decoration:none}
.logo img{display:none;width:auto}
.logo .lk{height:24px}
.logo .sym{height:26px}
.logo .lk.on-light{display:block}
:root[data-theme="dark"] .logo .lk.on-light{display:none}
:root[data-theme="dark"] .logo .lk.on-dark{display:block}
.sp{flex:1}
.search{height:36px;border:1px solid var(--chip);border-radius:999px;display:flex;align-items:center;gap:8px;padding:0 14px;color:var(--text2);width:min(380px,100%)}
.search .icon{width:18px;height:18px}
.search input{border:0;background:transparent;outline:0;flex:1;min-width:0;font-size:14px;color:var(--text2)}
.search input::placeholder{color:var(--text2)}
.right{display:flex;align-items:center;gap:6px}
.ib{width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;border:0;background:transparent;border-radius:6px;color:var(--text);cursor:pointer;padding:0;list-style:none}
.ib:disabled{cursor:default;color:var(--text2)}
.srch-ib,.burger{display:none}
.btn-login{height:36px;padding:0 14px;border:1px solid var(--chip);border-radius:6px;display:inline-flex;align-items:center;font-size:14px;font-weight:600;text-decoration:none;white-space:nowrap}
.btn-up{height:36px;padding:0 14px 0 12px;border-radius:6px;background:var(--red);color:var(--onred);font-size:14px;font-weight:700;display:inline-flex;align-items:center;gap:6px;white-space:nowrap;text-decoration:none}
.btn-up .icon{width:18px;height:18px;stroke-width:2}

/* body: sidebar + content */
.bd{flex:1;display:flex;align-items:flex-start}
.side{position:sticky;top:var(--hdr);width:224px;flex:none;align-self:stretch;border-right:1px solid var(--hairline);padding:14px 10px 24px}
.side .tree{display:flex;flex-direction:column;gap:2px;position:sticky;top:calc(var(--hdr) + 14px)}
.side .rail{display:none}
.side details{display:block}
.side summary{list-style:none;cursor:pointer}
.side summary::-webkit-details-marker,.drawer summary::-webkit-details-marker{display:none}
.side .row{display:flex;align-items:center;gap:12px;height:40px;padding:0 10px 0 22px;border-radius:6px;color:var(--text2);text-decoration:none;font-size:15px;font-weight:600;position:relative;white-space:nowrap}
.side .row:hover{color:var(--text)}
.side .row .icon{width:20px;height:20px}
.side .row.on{color:var(--text)}
.side .row.on::before{content:"";position:absolute;left:6px;top:50%;width:6px;height:6px;margin-top:-3px;border-radius:50%;background:var(--red)}
.side details .row.on::before{display:none}
.side .chv{margin-left:auto;width:16px;height:16px;stroke-width:2;color:var(--text2);transition:transform .15s}
.side details[open]>summary .chv{transform:rotate(180deg)}
.side .sub{display:flex;flex-direction:column;margin:0 0 6px}
.side .sub a{height:32px;display:flex;align-items:center;padding-left:54px;font-size:14px;font-weight:500;color:var(--text2);text-decoration:none;position:relative;border-radius:6px}
.side .sub a:hover{color:var(--text)}
.side .sub a.on{color:var(--text);font-weight:600}
.side .sub a.on::before{content:"";position:absolute;left:40px;top:50%;width:5px;height:5px;margin-top:-2.5px;border-radius:50%;background:var(--red)}
.side .sep{border-top:1px solid var(--hairline);margin:8px 10px}
main{flex:1;min-width:0;padding:24px 28px 56px;outline:0}
main .inner{max-width:1180px;margin:0 auto}
.ph{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:6px}
.display{margin:0;font-size:28px;font-weight:700;line-height:1.14;letter-spacing:-.01em}
.subtabs{display:flex;gap:4px;margin:14px 0 24px;border-bottom:1px solid var(--hairline);overflow-x:auto;scrollbar-width:none}
.subtabs::-webkit-scrollbar{display:none}
.subtabs a{flex:none;white-space:nowrap;padding:8px 12px 12px;font-size:15px;font-weight:600;color:var(--text2);text-decoration:none;position:relative;display:flex;align-items:center;gap:4px}
.subtabs a:hover{color:var(--text)}
.subtabs a.on{color:var(--text)}
.subtabs a.on::after{content:"";position:absolute;left:50%;bottom:-1px;width:6px;height:6px;margin-left:-3px;border-radius:50%;background:var(--red)}
.subtabs .ext{width:13px;height:13px}

/* empty state and quiet button */
.empty{padding:72px 0 96px;max-width:520px}
.empty h2{margin:0 0 8px;font-size:17px;font-weight:600}
.empty .display{margin-bottom:12px}
.empty p{margin:0 0 24px;color:var(--text2)}
.btn-quiet{height:40px;padding:0 16px;border:1px solid var(--chip);border-radius:6px;display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:600;text-decoration:none;white-space:nowrap}
.btn-quiet:hover{border-color:var(--text)}
.btn-quiet .icon{width:18px;height:18px}

/* download */
.lead{margin:0 0 8px;color:var(--text2);max-width:640px}
.stores{list-style:none;margin:8px 0 0;padding:0;max-width:760px}
.stores li{display:flex;align-items:center;gap:18px;padding:22px 0;border-bottom:1px solid var(--hairline)}
.stores li>.icon{width:28px;height:28px}
.stores .txt{flex:1;min-width:0}
.stores h2{margin:0 0 2px;font-size:17px;font-weight:600}
.stores p{margin:0;font-size:13px;font-weight:500;letter-spacing:.02em;color:var(--text2)}

/* footer */
.ft{border-top:1px solid var(--hairline);padding:26px 28px 30px}
.ft .inner{max-width:1180px;margin:0 auto}
.frow{display:flex;flex-wrap:wrap;gap:14px 28px;justify-content:space-between;align-items:center}
.links{display:flex;flex-wrap:wrap;gap:6px 22px;font-size:13px;font-weight:600}
.links a{text-decoration:none}
.links a:hover{text-decoration:underline;text-underline-offset:4px}
.links a.q{color:var(--text2)}
.prefs{display:flex;align-items:center;gap:12px;margin:0}
.sel{height:30px;border:1px solid var(--chip);border-radius:999px;padding:0 6px 0 10px;display:flex;align-items:center;gap:4px;font-size:13px;font-weight:500}
.sel .icon{width:14px;height:14px;stroke-width:2}
.sel select{border:0;background:transparent;font-size:13px;font-weight:500;padding:0 2px;cursor:pointer}
.sel select option{background:var(--menu);color:var(--text)}
.theme{display:inline-flex;border:1px solid var(--chip);border-radius:999px;overflow:hidden;height:30px;margin:0;padding:0}
.theme label{display:flex;align-items:center;justify-content:center;width:34px;color:var(--text2);cursor:pointer;position:relative}
.theme input{position:absolute;opacity:0;width:1px;height:1px}
.theme label:has(input:checked){background:var(--text);color:var(--ground)}
.theme label:has(input:focus-visible){outline:2px solid var(--text);outline-offset:-2px}
.theme .icon{width:14px;height:14px;stroke-width:2}
.apply{height:30px;padding:0 12px;border:1px solid var(--chip);border-radius:999px;background:transparent;font-size:13px;font-weight:600;cursor:pointer}
.js .apply{display:none}
.biz{margin:18px 0 0;font-size:12px;line-height:1.8;color:var(--text2)}
.biz span{white-space:nowrap}
.biz span+span::before{content:"·";margin:0 8px;color:var(--chip)}
.copy{margin:10px 0 0;font-size:12px;color:var(--text2)}

/* mobile drawer (hamburger) */
.drawer{position:static}
.drawer>summary{list-style:none}
.dpanel{display:none}
.drawer[open] .dpanel{display:flex;flex-direction:column;position:fixed;left:0;right:0;top:var(--hdr);bottom:0;background:var(--ground);z-index:40;overflow-y:auto}
.dhead{height:48px;flex:none;display:flex;align-items:center;justify-content:space-between;padding:0 6px 0 16px;border-bottom:1px solid var(--hairline)}
.dhead b{font-size:15px;font-weight:700}
.dlist{flex:1;padding:6px 8px}
.dlist details{display:block}
.dlist summary{list-style:none;cursor:pointer}
.drow{display:flex;align-items:center;gap:14px;height:50px;padding:0 10px 0 24px;text-decoration:none;font-size:16px;font-weight:600;position:relative;border-radius:6px}
.drow .icon{width:22px;height:22px;color:var(--text2)}
.drow.on .icon{color:var(--text)}
.drow.on::before{content:"";position:absolute;left:8px;top:50%;width:6px;height:6px;margin-top:-3px;border-radius:50%;background:var(--red)}
.drow .chv{margin-left:auto;width:18px;height:18px;stroke-width:2;transition:transform .15s}
.dlist details[open]>summary .chv{transform:rotate(180deg)}
.dsub{display:flex;flex-direction:column;padding:0 0 6px}
.dsub a{height:40px;padding:0 10px 0 60px;display:flex;align-items:center;font-size:15px;font-weight:500;color:var(--text2);text-decoration:none;position:relative}
.dsub a.on{color:var(--text);font-weight:600}
.dsub a.on::before{content:"";position:absolute;left:46px;top:50%;width:5px;height:5px;margin-top:-2.5px;border-radius:50%;background:var(--red)}
.dsep{border-top:1px solid var(--hairline);margin:6px 10px}
.dpanel .prefs{border-top:1px solid var(--hairline);padding:12px 16px 20px}

/* tablet: icon rail, search as an icon */
@media (max-width:1100px){
  .side{width:64px;padding:14px 8px}
  .side .tree{display:none}
  .side .rail{display:flex;flex-direction:column;gap:2px;position:sticky;top:calc(var(--hdr) + 14px)}
  .side .rail .row{justify-content:center;padding:0;height:44px}
  .side .rail .row.on::before{left:50%;top:auto;bottom:3px;margin:0 0 0 -3px}
  .side .sep{margin:8px 6px}
  .search{display:none}
  .srch-ib{display:inline-flex}
  main{padding:20px 20px 48px}
}
/* phone: hamburger menu instead of the sidebar, symbol-only logo */
@media (max-width:640px){
  :root{--hdr:52px}
  .hdr{padding:0 6px 0 14px;gap:2px}
  .logo{margin-right:0}
  .logo .lk.on-light,:root[data-theme="dark"] .logo .lk.on-dark{display:none}
  .logo .sym.on-light{display:block}
  :root[data-theme="dark"] .logo .sym.on-light{display:none}
  :root[data-theme="dark"] .logo .sym.on-dark{display:block}
  .right{gap:2px}
  .right .ib{width:36px}
  .burger{display:inline-flex}
  .btn-login{height:34px;padding:0 10px;font-size:13px;border:0}
  .btn-up{height:34px;padding:0 12px 0 10px;font-size:13px}
  .side{display:none}
  main{padding:18px 16px 40px}
  .display{font-size:24px}
  .subtabs{margin:10px -16px 16px;padding:0 16px}
  .subtabs a{padding:8px 10px 12px;font-size:14px}
  .empty{padding:48px 0 64px}
  .stores li{flex-wrap:wrap}
  .stores li .btn-quiet{margin-left:46px}
  .ft{padding:22px 16px 28px}
  .biz span{white-space:normal;display:block}
  .biz span+span::before{content:none}
  .biz br{display:none}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* about (homepage content, mock .impeccable/mocks/desktop-web/about-v1.html A) */
.eyebrow{margin:0 0 10px;font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text2)}
.big{margin:0 0 16px;font-size:44px;line-height:1.1;font-weight:800;letter-spacing:-.02em}
.mid{margin:0 0 20px;font-size:24px;line-height:1.25;font-weight:700;letter-spacing:-.01em;max-width:640px}
.lead2{margin:0 0 24px;font-size:17px;line-height:1.55;color:var(--text2);max-width:560px}
.acts{display:flex;gap:16px;align-items:center;flex-wrap:wrap}
.btn-text{font-size:14px;font-weight:600;text-decoration:none;color:var(--text2)}
.btn-text:hover{color:var(--text)}
.ab-hero{display:grid;grid-template-columns:1.05fr 1fr;gap:40px;align-items:center;padding:24px 0 56px;border-bottom:1px solid var(--hairline)}
.mosaic{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:180px 180px;gap:2px}
.mosaic img{width:100%;height:100%;object-fit:cover;display:block;background:var(--tile)}
.mosaic img:first-child{grid-row:span 2}
.ab-sec{padding:48px 0;border-bottom:1px solid var(--hairline)}
.feats{list-style:none;margin:0;padding:0;max-width:820px}
.feats li{display:grid;grid-template-columns:56px 1fr;gap:8px;padding:20px 0;border-top:1px solid var(--hairline)}
.feats .n{font-size:13px;font-weight:600;color:var(--text2);padding-top:3px}
.feats h3,.plats h3,.lr-cols h3{margin:0 0 4px;font-size:17px;font-weight:600}
.feats p,.plats p{margin:0;color:var(--text2);line-height:1.55}
.plats{list-style:none;margin:0 0 24px;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.plats li{border-top:1px solid var(--rule);padding-top:16px}
.ab-cta{padding:56px 0 24px}
/* download: Lightroom details */
.lr-more{margin-top:48px;max-width:960px}
.lr-more .mid{margin-bottom:4px}
.cap{margin:0 0 20px;font-size:13px;font-weight:500;letter-spacing:.02em;color:var(--text2)}
.lr-cols{display:grid;grid-template-columns:1fr 1fr;gap:40px}
.lr-cols h3{margin-bottom:10px}
.steps{margin:0;padding-left:20px;color:var(--text2);line-height:1.6}
.steps li{margin:0 0 8px}
.steps b,.reqs b{color:var(--text);font-weight:600}
.reqs{margin:0}
.reqs dt{font-size:13px;font-weight:600;margin-top:12px}
.reqs dt:first-child{margin-top:0}
.reqs dd{margin:2px 0 0;color:var(--text2);line-height:1.55;font-size:14px}
/* legal documents */
.doc-page{max-width:760px}
.doc-title{margin:8px 0 4px;font-size:24px;font-weight:700;line-height:1.25}
.doc-meta{margin:0 0 20px;font-size:13px;font-weight:500;color:var(--text2)}
.doc-toc{border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline);padding:10px 0;margin:0 0 24px}
.doc-toc summary{cursor:pointer;font-size:13px;font-weight:600;color:var(--text2)}
.doc-toc ol{margin:10px 0 4px;padding-left:22px;font-size:14px;line-height:1.7}
.doc-toc a{text-decoration:none}
.doc-toc a:hover{text-decoration:underline}
.doc{line-height:1.7}
.doc h1{display:none}
.doc h2{font-size:18px;margin:36px 0 10px;scroll-margin-top:calc(var(--hdr) + 16px)}
.doc h3{font-size:15px;margin:22px 0 8px}
.doc p,.doc li{color:var(--text)}
.doc .tbl{overflow-x:auto;margin:12px 0}
.doc table{border-collapse:collapse;width:100%;font-size:14px}
.doc th,.doc td{border:1px solid var(--rule);padding:6px 8px;text-align:left;vertical-align:top}
/* FAQ (faq.go): groups, then one <details> per question */
.faq-groups{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 8px}
.faq-groups a{height:32px;padding:0 12px;border:1px solid var(--chip);border-radius:16px;display:inline-flex;align-items:center;font-size:13px;font-weight:600;text-decoration:none}
.faq-groups a:hover{border-color:var(--text)}
.faq-group{scroll-margin-top:calc(var(--hdr) + 16px)}
.faq-group h2{font-size:18px;margin:36px 0 8px}
.faq-item{border-bottom:1px solid var(--hairline);scroll-margin-top:calc(var(--hdr) + 16px)}
.faq-item summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 0;font-size:15px;font-weight:600;line-height:1.45}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary .icon{flex:none;width:20px;height:20px;color:var(--text2);transition:transform .15s}
.faq-item[open] summary .icon{transform:rotate(180deg)}
.faq-item .doc{padding:0 36px 16px 0}
.faq-item .doc p{margin:0 0 8px}
.faq-more{margin:32px 0 0}
@media (max-width:1100px){.ab-hero{grid-template-columns:1fr}.plats{grid-template-columns:1fr}.lr-cols{grid-template-columns:1fr;gap:28px}}
@media (max-width:640px){.big{font-size:32px}.mid{font-size:20px}.mosaic{grid-template-rows:140px 140px}.feats li{grid-template-columns:36px 1fr}}

/* sign-in screens (mock .impeccable/mocks/desktop-web/auth-v1.html, layout A) */
.auth{max-width:400px;margin:24px auto 64px}
.auth .display{margin-bottom:8px}
.sub{margin:0 0 24px;color:var(--text2);line-height:1.55}
.aerr{margin:0 0 16px;padding:12px 14px;border:1px solid var(--red);border-left-width:4px;border-radius:6px;background:color-mix(in srgb,var(--red) 8%,transparent);font-size:14px;line-height:1.5;font-weight:600}
.aerr p{margin:0}
.aerr:focus{outline:none}
.aerr .aerr-acts{margin-top:8px;display:flex;gap:16px;flex-wrap:wrap;font-weight:600}
.aerr .aerr-acts a{color:var(--text);text-decoration:underline;text-underline-offset:3px}
.g-wrap{min-height:44px;display:flex;justify-content:center}
.gbtn{width:100%;display:flex;justify-content:center}
.or{display:flex;align-items:center;gap:12px;margin:22px 0 6px;color:var(--text2);font-size:13px}
.or::before,.or::after{content:"";flex:1;border-top:1px solid var(--hairline)}
.aform{margin:0}
.f{display:block;padding-top:14px}
.f .lab{display:block;font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text2)}
.f .inp{display:flex;align-items:center;border-bottom:1px solid var(--rule)}
.f .inp:focus-within{border-bottom-color:var(--text)}
.f input{flex:1;border:0;background:transparent;font:400 17px var(--font);color:var(--text);padding:8px 0;outline:0;min-width:0}
.f input::placeholder{color:var(--text2)}
.eye{border:0;background:transparent;color:var(--text2);padding:4px;cursor:pointer;display:flex}
.eye .icon{width:20px;height:20px}
.hint{display:block;font-size:13px;margin-top:6px;color:var(--text2);min-height:1em}
.hint.ok,.hint.bad{color:var(--text)}
.hint.bad::before{content:"! ";font-weight:700}
.hint.ok::before{content:"✓ "}
.rules{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.rules i{font-style:normal;font-size:12px;font-weight:500;padding:3px 9px;border:1px solid var(--chip);border-radius:999px;color:var(--text2)}
.rules i.on{border-color:var(--text);color:var(--text)}
.rules i.on::before{content:"✓ "}
.ts-wrap{margin:20px 0 4px;min-height:65px;display:flex;justify-content:center}
.btn-ink{width:100%;height:52px;margin-top:20px;border:0;border-radius:6px;background:var(--text);color:var(--ground);font:600 17px var(--font);cursor:pointer}
.btn-ink:disabled{opacity:.35;cursor:default}
.btn-quiet.wide{width:100%;height:52px;justify-content:center;font-size:17px;margin-top:8px}
.note{margin:12px 0 0;font-size:13px;color:var(--text2);line-height:1.5}
.alinks{margin:16px 0 0;font-size:14px;color:var(--text2);text-align:center}
.alinks a,.alinks .link{color:var(--text);font-weight:600;text-decoration:none}
.alinks a.u,.alinks a:hover{text-decoration:underline;text-underline-offset:3px}
.legal{margin:28px 0 0;font-size:12px;line-height:1.6;color:var(--text2);text-align:center}
.legal a{color:var(--text2)}
.code{width:100%;height:64px;margin:8px 0 10px;border:0;border-bottom:2px solid var(--rule);background:transparent;color:var(--text);font:700 32px var(--font);letter-spacing:.6em;text-align:center;outline:0;padding-left:.6em}
.code:focus{border-bottom-color:var(--text)}
.meta{display:flex;justify-content:space-between;align-items:center;margin:0;font-size:13px;color:var(--text2)}
.resend{margin-top:8px;text-align:center}
.link{border:0;background:transparent;font:600 14px var(--font);color:var(--text);cursor:pointer;padding:0}
.link:disabled{color:var(--text2);cursor:default}
.all{display:flex;align-items:center;gap:12px;padding:14px 0;border-bottom:1px solid var(--rule);font-size:17px;cursor:pointer}
.all b{font-weight:600}
.consents{list-style:none;margin:0;padding:0}
.consents li{display:grid;grid-template-columns:1fr auto auto;gap:12px;align-items:start;padding:12px 0;border-bottom:1px solid var(--hairline)}
.consents label{display:flex;gap:12px;align-items:flex-start;cursor:pointer}
.consents b{display:block;font-weight:500;font-size:15px}
.consents small{display:block;font-size:12px;color:var(--text2);margin-top:2px}
.all input,.consents input{position:absolute;opacity:0;width:1px;height:1px}
.ck{width:22px;height:22px;border:1.5px solid var(--chip);border-radius:50%;display:inline-block;flex:none;position:relative}
input:checked+.ck{background:var(--text);border-color:var(--text)}
input:checked+.ck::after{content:"";position:absolute;left:6.5px;top:3px;width:5px;height:10px;border:solid var(--ground);border-width:0 2px 2px 0;transform:rotate(45deg)}
input:focus-visible+.ck{outline:2px solid var(--text);outline-offset:2px}
.req{font-size:12px;font-weight:600;color:var(--text);padding-top:2px}
.req.opt{color:var(--text2)}
.doc{font-size:12px;color:var(--text2);padding-top:2px}
.done{color:var(--text);margin-bottom:16px}
/* signed-in account menu */
.umenu{position:relative}
.umenu>summary{list-style:none;cursor:pointer}
.umenu>summary::-webkit-details-marker{display:none}
.avatar{width:32px;height:32px;border-radius:50%;background:var(--tile);border:1px solid var(--hairline);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;color:var(--text);margin:0 6px;position:relative;overflow:hidden}
/* The avatar picture covers the initial; app.js hides one that fails. */
.avatar>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:50%;pointer-events:none}
.avatar>img[hidden]{display:none}
.upanel{position:absolute;right:0;top:42px;min-width:200px;background:var(--menu);border:1px solid var(--hairline);border-radius:8px;padding:6px;z-index:45;display:flex;flex-direction:column}
:root:not([data-theme="dark"]) .upanel{box-shadow:0 8px 24px rgba(0,0,0,.08)}
.uname{margin:0;padding:8px 12px;font-size:13px;color:var(--text2);border-bottom:1px solid var(--hairline);margin-bottom:4px}
.upanel a,.upanel button{display:block;width:100%;text-align:left;padding:9px 12px;border:0;background:transparent;font:500 14px var(--font);color:var(--text);text-decoration:none;border-radius:6px;cursor:pointer}
.upanel a:hover,.upanel button:hover{background:var(--tile)}
.upanel form{margin:0}

/* upload (mock .impeccable/mocks/desktop-web/upload-v1.html) */
.cap2{margin:4px 0 0;font-size:13px;font-weight:500;color:var(--text2);letter-spacing:.02em;line-height:1.5}
.uphead{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:18px}
.drop{margin:24px 0 28px;border:1.5px dashed var(--chip);border-radius:8px;min-height:320px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;padding:24px;cursor:pointer}
.drop.over,.u-work.over{border-color:var(--text);background:var(--tile)}
.drop input{position:absolute;width:1px;height:1px;opacity:0}
.drop .big{width:40px;height:40px;color:var(--text2)}
.drop b{font-size:20px}
.drop>span{color:var(--text2);font-size:13px}
.btn-ink2{height:40px;padding:0 18px;border:0;border-radius:6px;background:var(--text);color:var(--ground)!important;font:600 15px var(--font);cursor:pointer;display:inline-flex;align-items:center;text-decoration:none;white-space:nowrap}
.btn-ink2:disabled{opacity:.35;cursor:default}
.btn-quiet:disabled{opacity:.4;cursor:default}
label.btn-quiet{cursor:pointer}
.u-lr{display:flex;flex-wrap:wrap;align-items:center;gap:16px;padding:18px 20px;border:1px solid var(--hairline);border-radius:8px;margin:-12px 0 28px}
.u-lr .lr-mark{width:44px;height:44px;flex:none;border:1.5px solid var(--text);border-radius:8px;display:flex;align-items:center;justify-content:center;font-weight:700;letter-spacing:.02em}
.u-lr>.lr-txt{flex:1 1 360px;min-width:0;display:flex;flex-direction:column;gap:3px}
.u-lr>.lr-txt span{font-size:13px;color:var(--text2);line-height:1.5}
/* Lightroom plugin: Mac and Windows buttons of equal width (the wider label
   sets both), the Windows guide link under them; one column on phones */
.lr-btns{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.u-lr .lr-btns{flex:0 0 auto}
.lr-btn{justify-content:center;min-width:176px}
.lr-btn .lr-v{font-size:12px;font-weight:500;color:var(--text2)}
.lr-btn.is-soon{opacity:.55;cursor:default}
.lr-btn.is-soon:hover{border-color:var(--chip)}
.u-lr .lr-guide{flex-basis:100%;text-align:right;font-size:13px;font-weight:500;color:var(--text);text-decoration:underline;text-underline-offset:3px}
.lr-btns-dl{display:inline-grid;margin:0 0 28px}
.lr-os{border:0;margin:0;padding:0;min-width:0}
.lr-os .seg{display:inline-flex;border:1px solid var(--chip);border-radius:999px;overflow:hidden;margin:0 0 14px}
.lr-os .seg label{padding:6px 16px;font-size:13px;font-weight:600;color:var(--text2);cursor:pointer}
.lr-os .seg label:hover{color:var(--text)}
#lr-os-mac:checked~.seg label[for="lr-os-mac"],#lr-os-win:checked~.seg label[for="lr-os-win"]{background:var(--text);color:var(--ground)}
#lr-os-mac:focus-visible~.seg label[for="lr-os-mac"],#lr-os-win:focus-visible~.seg label[for="lr-os-win"]{outline:2px solid var(--text);outline-offset:-4px}
.lr-os .lr-win,#lr-os-win:checked~.lr-mac{display:none}
#lr-os-win:checked~.lr-win{display:block}
.lr-gl{margin:4px 0 0;font-size:14px}
.lr-gl a{color:var(--text);font-weight:600;text-underline-offset:3px}
@media (max-width:720px){
  .lr-btns,.lr-btns-dl{display:grid;grid-template-columns:minmax(0,1fr);width:100%}
  .lr-btn{min-width:0;white-space:normal;text-align:center;flex-wrap:wrap;height:auto;min-height:40px;padding-top:6px;padding-bottom:6px}
  .u-lr .lr-btns{flex:1 1 100%}
  .u-lr .lr-guide{text-align:left}
}
.tips{list-style:none;margin:0;padding:0;max-width:760px}
.tips li{padding:12px 0;border-top:1px solid var(--hairline);color:var(--text2);line-height:1.55}
.u-msg{margin:0 0 12px;padding:10px 12px;border-left:3px solid var(--text);background:var(--menu);font-size:13px}
.uplay{display:grid;grid-template-columns:1fr 380px;gap:28px;align-items:start}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(132px,1fr));gap:2px;align-content:start}
.grid.small{grid-template-columns:repeat(auto-fill,minmax(110px,1fr));margin:20px 0}
.tile{position:relative;aspect-ratio:1;border:0;padding:0;background:var(--tile);cursor:pointer;overflow:hidden;display:block;color:var(--text2)}
.tile img{width:100%;height:100%;object-fit:cover;display:block}
.tile .ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font:700 13px var(--font);letter-spacing:.08em}
.tile.picked{outline:3px solid var(--text);outline-offset:-3px}
.tile.multi::after{content:"";position:absolute;inset:0;background:rgba(17,17,17,.18);box-shadow:inset 0 0 0 3px var(--text)}
.tile .band{position:absolute;left:0;right:0;bottom:0;height:26px;background:rgba(0,0,0,.55);color:#F2F2F2;font:500 12px var(--font);display:flex;align-items:center;gap:6px;padding:0 8px;white-space:nowrap;overflow:hidden}
.tile.review img{filter:blur(6px)}
.tile .dot{width:6px;height:6px;border-radius:50%;background:var(--red);flex:none}
.tile.rejected img,.tile.dup img,.tile.private img,.tile.fail img{opacity:.45}
.tile.wait img{opacity:.7}
.tile .bar{position:absolute;left:0;right:0;bottom:0;height:2px;background:rgba(255,255,255,.25)}
.tile .bar b{display:block;height:2px;background:#F2F2F2;width:0}
.tile .edited{position:absolute;right:6px;top:6px;width:20px;height:20px;border-radius:50%;background:rgba(0,0,0,.62);color:#fff;font-size:11px;display:flex;align-items:center;justify-content:center}
.tile.add{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;background:transparent;border:1.5px dashed var(--chip);color:var(--text2);text-align:center;padding:8px}
.tile.add:hover,.tile.add:focus-within{border-color:var(--text);color:var(--text)}
.tile.add span{font-size:30px;line-height:1;font-weight:300}
.tile.add small{font-size:12px;font-weight:600}
.tile.add small.sub{font-weight:500;color:var(--text2)}
.dpanel2{position:sticky;top:76px;border-left:1px solid var(--hairline);padding-left:24px;margin:0}
.dprev{display:flex;gap:12px;padding-bottom:12px;border-bottom:1px solid var(--hairline)}
.dprev .thumb{width:72px;height:72px;flex:none;background:var(--tile)}
.dprev .thumb img{width:72px;height:72px;object-fit:cover;display:block}
.dprev b{display:block;font-size:14px;word-break:break-all}
.dprev span{display:block;font-size:12px;color:var(--text2);margin-top:2px}
.p-state{margin:8px 0 0;font-size:12px;color:var(--text2)}
.dpanel2 .f input,.dpanel2 .f textarea,.dpanel2 .f select{flex:1;border:0;background:transparent;font:400 15px var(--font);color:var(--text);padding:7px 0;outline:0;resize:vertical;min-width:0}
.dpanel2 .f select option{background:var(--menu);color:var(--text)}
.f .lab small{letter-spacing:0;text-transform:none;font-weight:500}
.two{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.chips{display:flex;flex-wrap:wrap;gap:6px;padding:8px 0;border-bottom:1px solid var(--rule)}
.chips i{font-style:normal;font-size:13px;padding:3px 6px 3px 10px;border:1px solid var(--chip);border-radius:999px;display:inline-flex;align-items:center;gap:2px}
.chips i button{border:0;background:transparent;color:var(--text2);cursor:pointer;font-size:14px;line-height:1;padding:0 2px}
.chips input{border:0;background:transparent;font:14px var(--font);color:var(--text);outline:0;min-width:80px;flex:1}
.seg2{display:inline-flex;flex-wrap:wrap;border:1px solid var(--chip);border-radius:6px;overflow:hidden;margin-top:8px}
.seg2 button{border:0;background:transparent;font:500 13px var(--font);padding:6px 11px;color:var(--text2);cursor:pointer}
.seg2 button.on{background:var(--text);color:var(--ground)}
.hint2{display:block;margin-top:6px;font-size:12px;color:var(--text2);line-height:1.5}
.applyall{margin:18px 0 0;padding-top:16px;border-top:1px solid var(--hairline)}
.btn-quiet3{height:40px;width:100%;padding:0 14px;border:1px solid var(--chip);border-radius:6px;background:transparent;color:var(--text);font:600 14px var(--font);display:flex;align-items:center;justify-content:center;gap:8px;cursor:pointer}
.btn-quiet3:disabled{opacity:.4;cursor:default}
.btn-quiet3 .icon{width:18px;height:18px}
.toast{margin-top:12px;padding:10px 12px;border-left:3px solid var(--text);background:var(--menu);font-size:13px;display:flex;justify-content:space-between;align-items:center;gap:12px}
.ubar{position:sticky;bottom:0;margin-top:20px;background:var(--ground);border-top:1px solid var(--rule);min-height:68px;display:flex;align-items:center;gap:12px;padding:10px 0;z-index:5}
.grow{flex:1}
.sw{display:flex;align-items:center;gap:10px;cursor:pointer}
.sw input{position:absolute;opacity:0;width:1px;height:1px}
.sw .track{width:40px;height:24px;border-radius:12px;background:var(--chip);position:relative;flex:none}
.sw .track::after{content:"";position:absolute;left:3px;top:3px;width:18px;height:18px;border-radius:50%;background:#fff}
.sw input:checked+.track{background:var(--text)}
.sw input:checked+.track::after{left:19px;background:var(--ground)}
.sw input:focus-visible+.track{outline:2px solid var(--text);outline-offset:2px}
.sw small{display:block;font-size:12px;color:var(--text2)}
.donehd{display:flex;gap:16px;align-items:center}
.acts2{display:flex;gap:12px;flex-wrap:wrap;margin-top:12px}
.ask{border:1px solid var(--hairline);border-radius:8px;background:var(--menu);color:var(--text);padding:24px;max-width:420px}
.ask::backdrop{background:rgba(0,0,0,.45)}
.ask h2{margin:0 0 8px;font-size:18px}
.ask p{margin:0 0 8px;color:var(--text2);line-height:1.55;font-size:14px}
@media (max-width:1100px){.uplay{grid-template-columns:1fr}.dpanel2{position:static;border-left:0;padding-left:0;border-top:1px solid var(--hairline);padding-top:12px}}
@media (max-width:640px){.ubar{flex-wrap:wrap}.ubar .grow{display:none}.drop{min-height:220px}}
/* sign-up optional details (mock auth-v2) */
.grp{display:block;margin:26px 0 0;font-size:13px;font-weight:700;letter-spacing:.04em;color:var(--text)}
.opt{margin-top:28px;border-top:1px solid var(--hairline)}
.opt>summary{list-style:none;cursor:pointer;position:relative;padding-right:28px}
.opt>summary::-webkit-details-marker{display:none}
.opt>summary .chv{position:absolute;right:0;top:24px;width:18px;height:18px;stroke-width:2;color:var(--text2);transition:transform .15s}
.opt[open]>summary .chv{transform:rotate(180deg)}
.cap3{display:block;margin-top:4px;font-size:12px;color:var(--text2)}
.auth .f select,.auth .f textarea{flex:1;border:0;background:transparent;font:400 16px var(--font);color:var(--text);padding:8px 0;outline:0;min-width:0;resize:vertical}
.auth .f select option,.auth .f select optgroup{background:var(--menu);color:var(--text)}
.picks-f{border:0;margin:0;padding:14px 0 0}
.picks-f legend{padding:0}
.picks{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.picks label{cursor:pointer}
.picks input{position:absolute;opacity:0;width:1px;height:1px}
.picks span{display:inline-block;font-size:13px;padding:5px 11px;border:1px solid var(--chip);border-radius:999px;color:var(--text2)}
.picks input:checked+span{border-color:var(--text);color:var(--text);font-weight:600}
.picks input:checked+span::before{content:"✓ "}
.picks input:focus-visible+span{outline:2px solid var(--text);outline-offset:2px}

/* photowall — PhotoWall tabs and the photo page (wall.go, mock .impeccable/mocks/desktop-web/photowall-v1.html) */
.pw .caption,.pw-dlg .caption,.pw-pop .caption{font-size:13px;font-weight:500;letter-spacing:.02em;line-height:1.4;color:var(--text2);margin:0}
.pw .label{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text2)}
.pw-link{border:0;background:transparent;padding:0;font:600 13px var(--font);color:var(--text2);cursor:pointer;text-decoration:none}
.pw-link:hover{color:var(--text)}
.pw .chips{display:flex;flex-wrap:wrap;gap:8px;padding:0;border:0}
.pw .chip{height:34px;border:1px solid var(--chip);border-radius:999px;padding:0 14px;display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:500;color:var(--text);text-decoration:none;white-space:nowrap}
.pw a.chip:hover{border-color:var(--text)}
.pw .chip .n{color:var(--text2);font-size:12px}
.pw .chip.rc{padding:0 6px 0 14px}
.pw .chip.rc a{text-decoration:none}
.pw .chip.rc button{border:0;background:transparent;color:var(--text2);cursor:pointer;padding:2px;display:flex}
.pw .chip.rc .icon{width:14px;height:14px;stroke-width:2}
.rk{width:16px;height:16px;flex:none}
/* The laurel (icons.html "laurel", iOS RankerBadge): places 4–100 in the
   text colour at 20 px; 1–3 in metal with the numeral at 22 px. Metals and
   numerals take the app's deeper tone on the light ground, the bright tone
   on the dark ground and on photos (.ph: the pill, the tile mark). */
.lr{width:20px;height:20px;flex:none;overflow:visible}
.lr1,.lr2,.lr3{width:22px;height:22px}
.lrn{font:800 9px Manrope,var(--font);text-anchor:middle}
.lra1{stop-color:#B07E12}.lrb1{stop-color:#7E5A0C}.lr1 .lrn{fill:#7E5A0C}
.lra2{stop-color:#76828E}.lrb2{stop-color:#3E4954}.lr2 .lrn{fill:#3E4954}
.lra3{stop-color:#A0643A}.lrb3{stop-color:#6E4022}.lr3 .lrn{fill:#6E4022}
:root[data-theme="dark"] .lra1{stop-color:#F2D27A}:root[data-theme="dark"] .lrb1{stop-color:#9A6B12}:root[data-theme="dark"] .lr1 .lrn,.lr1.ph .lrn{fill:#F2D27A}
:root[data-theme="dark"] .lra2{stop-color:#F4F6F8}:root[data-theme="dark"] .lrb2{stop-color:#7E848A}:root[data-theme="dark"] .lr2 .lrn,.lr2.ph .lrn{fill:#E6EDF4}
:root[data-theme="dark"] .lra3{stop-color:#E2AE80}:root[data-theme="dark"] .lrb3{stop-color:#7A4A2A}:root[data-theme="dark"] .lr3 .lrn,.lr3.ph .lrn{fill:#E2AE80}
.nm.pod{-webkit-background-clip:text;background-clip:text;color:transparent}
.pod1{background-image:linear-gradient(100deg,#B07E12,#7E5A0C 55%,#B07E12)}
.pod2{background-image:linear-gradient(100deg,#76828E,#3E4954 42%,#67737F 70%,#46515C)}
.pod3{background-image:linear-gradient(100deg,#A0643A,#6E4022 55%,#A0643A)}
:root[data-theme="dark"] .pod1{background-image:linear-gradient(100deg,#F2D27A,#C9982E 55%,#F2D27A)}
:root[data-theme="dark"] .pod2{background-image:linear-gradient(100deg,#E6EDF4,#7F8D9B 42%,#C8D3DD 70%,#8C99A6)}
:root[data-theme="dark"] .pod3{background-image:linear-gradient(100deg,#E2AE80,#A86A3E 55%,#E2AE80)}

/* tab row + sort */
.pw-bar{display:flex;align-items:flex-end;gap:8px;margin:14px 0 24px;border-bottom:1px solid var(--hairline)}
.pw-bar .subtabs{margin:0;border:0;flex:1;min-width:0}
.pw-sort{position:relative;flex:none}
.pw-sort>summary{list-style:none}
.pw-sort>summary::-webkit-details-marker{display:none}
.pw-sortbtn,.pw-sort.dim{display:flex;align-items:center;gap:6px;padding:8px 4px 12px 10px;color:var(--text2);font-size:13px;font-weight:500;cursor:pointer;position:relative;white-space:nowrap}
.pw-sortbtn:hover{color:var(--text)}
.pw-sort .icon{width:14px;height:14px;stroke-width:2}
.pw-sortbtn.off::before{content:"";position:absolute;left:0;top:16px;width:5px;height:5px;border-radius:50%;background:var(--text)}
.pw-sort.dim{cursor:default}
.pw-sort.dim .icon{opacity:.45}
.pw-menu{position:absolute;right:0;top:calc(100% + 4px);z-index:20;min-width:200px;background:var(--menu);border:1px solid var(--hairline);border-radius:8px;padding:6px;display:flex;flex-direction:column}
:root:not([data-theme="dark"]) .pw-menu,:root:not([data-theme="dark"]) .pw-pop{box-shadow:0 8px 24px rgba(0,0,0,.10)}
:root[data-theme="dark"] .pw-menu,:root[data-theme="dark"] .pw-pop{box-shadow:0 8px 24px rgba(0,0,0,.6)}
.pw-menu a{height:36px;padding:0 12px;display:flex;align-items:center;gap:10px;font-size:14px;font-weight:500;color:var(--text);text-decoration:none;border-radius:6px}
.pw-menu a:hover{background:var(--tile)}
.pw-menu a .icon{width:18px;height:18px;color:var(--text2)}
.pw-menu a.on{font-weight:700}
.pw-menu a.on::after{content:"";margin-left:auto;width:6px;height:6px;border-radius:50%;background:var(--text)}

/* cards: no-JS falls back to CSS columns; wall.js lays them out row by row */
.pw-wall{columns:3;column-gap:24px}
.pw-wall.cols2{columns:2;column-gap:40px}
.pw-wall.laid{columns:auto;display:flex;align-items:flex-start;gap:24px}
.pw-wall.cols2.laid{gap:40px}
.pw-col{flex:1;min-width:0;display:flex;flex-direction:column;gap:28px}
.pw-wall.cols2 .pw-col{gap:44px}
.pw-wall:not(.laid) .pw-card{break-inside:avoid;margin-bottom:28px}
.pw-card{display:flex;flex-direction:column;gap:10px;min-width:0}
.pw-ph{display:block;position:relative;background:var(--tile);border-radius:12px;overflow:hidden}
.pw-ph img{display:block;width:100%;height:auto;border-radius:12px}
.pw-pill{position:absolute;left:10px;top:10px;height:26px;padding:0 9px;border-radius:999px;background:rgba(0,0,0,.55);color:#F2F2F2;font-size:13px;font-weight:700;display:flex;align-items:center;gap:4px}
.pw-pill:has(.lr){padding-left:4px}
/* the pill and the tile mark stay dark translucent in both themes: their laurels take the bright metals (.ph) */
.pw-pill.trend{box-shadow:inset 0 0 0 1px rgba(255,255,255,.35);padding-left:7px}
.pw-pill.trend .icon{width:15px;height:15px;stroke-width:2}
.pw-meta{display:flex;align-items:center;gap:10px;min-height:44px}
.pw-meta .avatar,.pd-author .avatar,.pd-c .avatar,.pw-popwho .avatar{margin:0;flex:none;color:var(--text2)}
.pw-meta .who{display:flex;flex-direction:column;min-width:0;flex:1}
.pw .name{display:flex;align-items:center;gap:5px;font-size:15px;font-weight:600;line-height:1.3;min-width:0}
.pw .name .nm{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.pw-meta .cam{font-size:12px;color:var(--text2);font-weight:500;letter-spacing:.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pw-meta .cam b{color:var(--text);font-weight:700}
.pw-wall.cols2 .pw-meta .avatar{width:36px;height:36px}
.pw-wall.cols2 .name{font-size:16px}
.pw-wall.cols2 .pw-meta .cam{font-size:13px}
.pw-meta .stats{display:flex;align-items:center;gap:2px;flex:none}
.pw-meta .stats>*{display:flex;align-items:center;gap:4px;border:0;background:transparent;padding:4px;color:var(--text2);font:600 13px var(--font);cursor:pointer;text-decoration:none;border-radius:6px}
.pw-meta .stats>*:hover{color:var(--text)}
.pw-meta .stats .icon{width:20px;height:20px}
.pw-like.on .icon,.pd-icons .pw-like.on .icon,.pd-clike.on .icon{fill:var(--red);stroke:var(--red)}
.pw-like.on{color:var(--text)}
.pw-cm.on .icon{fill:var(--text);stroke:var(--text)}
.pw-lead{padding:0 0 20px;margin:-4px 0 24px;border-bottom:1px solid var(--hairline);display:flex;flex-direction:column;gap:6px}
.pw-lead p{margin:0;font-size:15px;color:var(--text2)}
.pw .ph .caption{padding-bottom:4px}

/* next pages */
.pw-next{display:flex;flex-direction:column;align-items:center;gap:10px;padding:28px 0 8px}
.pw-next .btn-quiet{cursor:pointer}

/* empty states */
.pw-empty{display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;padding:80px 16px 96px}
.pw-empty>.icon{width:40px;height:40px;color:var(--text2);stroke-width:1.3}
.pw-empty b{font-size:17px;font-weight:700;max-width:440px}
.pw-empty .caption{max-width:440px;line-height:1.55}
.pw-empty .btn-quiet{margin-top:8px;background:transparent;cursor:pointer}

/* tags */
.pw-tagsearch{position:relative;max-width:620px}
.pw-tagpill{height:48px;border:1px solid var(--chip);border-radius:999px;display:flex;align-items:center;gap:10px;padding:0 8px 0 18px;color:var(--text2);margin:0}
.pw-tagpill:focus-within{border-color:var(--text)}
.pw-tagpill .icon{width:20px;height:20px}
.pw-tagpill input{flex:1;min-width:0;border:0;outline:0;background:transparent;font-size:15px;color:var(--text)}
.pw-tagpill input::placeholder{color:var(--text2)}
.pw-tagpill input::-webkit-search-cancel-button{display:none}
.pw-tagclear{border:0;background:var(--tile);color:var(--text);width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0}
.pw-tagclear .icon{width:14px;height:14px;stroke-width:2}
.pw-tagsel{height:32px;border-radius:999px;background:var(--text);color:var(--ground);font-size:14px;font-weight:700;display:flex;align-items:center;gap:6px;padding:0 8px 0 14px;text-decoration:none;min-width:0}
.pw-tagsel span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pw-tagsel .icon{width:16px;height:16px;stroke-width:2}
.pw-sugg{position:absolute;left:0;right:0;top:54px;z-index:20;background:var(--menu);border:1px solid var(--hairline);border-radius:12px;padding:6px;display:flex;flex-direction:column}
:root:not([data-theme="dark"]) .pw-sugg{box-shadow:0 8px 24px rgba(0,0,0,.10)}
.pw-sugg a{height:44px;display:flex;align-items:center;gap:10px;padding:0 12px;font-size:15px;border-radius:8px;text-decoration:none;color:var(--text)}
.pw-sugg a:hover,.pw-sugg a:focus{background:var(--tile)}
.pw-sugg a .icon{width:18px;height:18px;color:var(--text2)}
.pw-sugg a span:first-of-type{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pw-sugg .n{color:var(--text2);font-size:13px}
.pw-suggmsg{padding:12px}
.pw-tsec{margin-top:26px}
.pw-tsec .h{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.pw-resbar{display:flex;justify-content:space-between;margin:20px 0 10px}
.pw-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:2px}
.pw-tile{display:block;position:relative;aspect-ratio:1;background:var(--tile);overflow:hidden}
.pw-tile img{width:100%;height:100%;object-fit:cover;display:block}
.pw-tmark{position:absolute;left:5px;top:5px;width:28px;height:28px;border-radius:50%;background:rgba(0,0,0,.55);color:#F2F2F2;font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center}

/* ··· menu, dialogs, toast */
.pw-pop{position:fixed;z-index:50;min-width:230px;background:var(--menu);border:1px solid var(--hairline);border-radius:8px;padding:6px;display:flex;flex-direction:column}
.pw-pop hr{border:0;border-top:1px solid var(--hairline);margin:6px 0;width:100%}
.pw-pop button{height:36px;padding:0 12px;display:flex;align-items:center;gap:10px;border:0;background:transparent;font:500 14px var(--font);color:var(--text);border-radius:6px;cursor:pointer;text-align:left}
.pw-pop button:hover,.pw-pop button:focus{background:var(--tile)}
.pw-pop button:focus-visible,.pw-sugg a:focus-visible,.pw-menu a:focus-visible{outline:2px solid var(--text);outline-offset:-2px}
.pw-pop button .icon{width:18px;height:18px;color:var(--text2)}
.pw-popwho{display:flex;flex-direction:column;gap:2px;padding:8px 12px 6px}
.pw-popwho b{font-size:14px}
.pw-dlg{border:1px solid var(--hairline);border-radius:12px;background:var(--menu);color:var(--text);padding:0;width:min(440px,calc(100vw - 32px))}
.pw-dlg::backdrop{background:rgba(0,0,0,.5)}
.pw-dform{display:flex;flex-direction:column;gap:12px;padding:22px 22px 18px;margin:0}
.pw-dform h2{margin:0;font-size:17px;font-weight:700}
.pw-dform fieldset{border:0;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}
.pw-reasons label{display:flex;gap:10px;align-items:flex-start;padding:8px 0;font-size:14px;cursor:pointer}
.pw-reasons input{margin-top:3px;accent-color:var(--text)}
.pw-dform textarea{border:1px solid var(--chip);border-radius:8px;background:transparent;padding:10px 12px;font:14px var(--font);color:var(--text);resize:vertical}
.pw-genrelist{flex-direction:row!important;flex-wrap:wrap;gap:8px!important}
.pw-genrelist .chip{height:34px;border:1px solid var(--chip);border-radius:999px;padding:0 14px;display:inline-flex;align-items:center;font-size:14px;cursor:pointer;position:relative}
.pw-genrelist input{position:absolute;opacity:0;pointer-events:none}
.pw-genrelist .chip:has(input:checked){background:var(--text);color:var(--ground);border-color:var(--text)}
.pw-genrelist .chip:has(input:focus-visible){outline:2px solid var(--text);outline-offset:2px}
.pw-derr{margin:0;font-size:13px;color:var(--text)}
.pw-dacts{display:flex;justify-content:flex-end;gap:8px;margin-top:4px}
.pw-dacts .btn-quiet{background:transparent;cursor:pointer}
.pw-toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:60;background:var(--text);color:var(--ground);padding:10px 16px;border-radius:8px;font-size:14px;font-weight:600;max-width:calc(100vw - 32px)}

/* photo page */
.pd-grid{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:32px;align-items:start}
.pd-back{display:inline-flex;align-items:center;gap:4px;font-size:14px;font-weight:600;color:var(--text2);text-decoration:none;margin:0 0 14px}
.pd-back:hover{color:var(--text)}
.pd-back .icon{width:18px;height:18px;stroke-width:2}
.pd-stage{position:relative;margin:0;background:var(--tile);display:flex;align-items:center;justify-content:center;max-height:calc(100vh - var(--hdr) - 120px);min-height:240px}
.pd-stage img{display:block;max-width:100%;max-height:calc(100vh - var(--hdr) - 120px);width:auto;height:auto}
.pd-pick{position:absolute;left:12px;top:12px;font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#F2F2F2;background:rgba(0,0,0,.55);padding:4px 8px;border-radius:4px}
.pd-nav{position:absolute;top:50%;width:44px;height:44px;margin-top:-22px;border-radius:50%;background:rgba(0,0,0,.55);color:#F2F2F2;display:flex;align-items:center;justify-content:center}
.pd-nav .icon{width:22px;height:22px;stroke-width:2}
.pd-nav.l{left:12px}.pd-nav.r{right:12px}
.pd-notice{display:flex;gap:8px;align-items:flex-start;margin:10px 0 0}
.pd-notice .icon{width:16px;height:16px;color:var(--text2);margin-top:1px}
.pd-panel{display:flex;flex-direction:column;gap:16px;position:sticky;top:calc(var(--hdr) + 24px)}
.pd-author{display:flex;align-items:center;gap:10px}
.pd-author .avatar{width:40px;height:40px}
.pd-author .who{flex:1;min-width:0;display:flex;flex-direction:column}
.pd-follow{height:34px;padding:0 16px;border-radius:999px;border:1px solid var(--text);background:var(--text);color:var(--ground);font:700 14px var(--font);cursor:pointer;white-space:nowrap}
.pd-follow.on{background:transparent;color:var(--text);border-color:var(--chip)}
.pd-title{margin:0;font-size:24px;font-weight:700;line-height:1.2;text-wrap:balance}
.pd-rank{display:flex;align-items:center;gap:6px}
.pd-icons{display:flex;gap:10px;margin-left:-6px}
.pd-icons button{border:0;background:transparent;color:var(--text);padding:6px;border-radius:6px;cursor:pointer;display:flex}
.pd-icons button:hover{background:var(--tile)}
.pd-icons .pw-dots{margin-left:auto}
.pd-save.on .icon{fill:var(--text)}
.pd-desc{margin:0;font-size:15px;line-height:1.6;white-space:pre-line}
/* "See translation": the translated title/description under the source, in the secondary grey. */
.pd-tr{margin:-10px 0 0;font-size:15px;line-height:1.6;white-space:pre-line;color:var(--text2)}
.pd-tr.t{font-size:17px;font-weight:500;line-height:1.35}
.pd-trbtn{align-self:flex-start;margin-top:-8px}
.pd-trbtn[aria-busy=true],.pd-ctr-btn[aria-busy=true]{opacity:.45}
.pd-ctr{margin:4px 0 0;color:var(--text2)}
.pd-stats{display:flex;flex-wrap:wrap;gap:6px 16px;margin:0;font-size:13px;color:var(--text2);font-weight:600}
.pd-plate{border:1px solid var(--rule);border-radius:2px;padding:14px 16px;display:flex;flex-direction:column;gap:10px}
.pd-plate .r{display:flex;justify-content:space-between;gap:12px;font-size:14px}
.pd-plate .r .label{flex:none;padding-top:2px}
.pd-plate .r span:last-child{text-align:right;min-width:0}
.pd-plate .exp{border-top:1px solid var(--hairline);padding-top:10px;font-size:13px;font-weight:600;display:flex;gap:6px 14px;flex-wrap:wrap}
.pd-tags{display:flex;flex-direction:column;gap:10px}
/* Location card (photo-detail-clients §3 9): a map like a photo — no border
   or rounding — the pin drawn over its centre, the place capsule top left
   (clear of the Google logo bottom left). */
.pd-loc{display:flex;flex-direction:column;gap:10px}
.pd-map{position:relative;aspect-ratio:9/4;min-height:150px;background:var(--tile);overflow:hidden}
.pd-mapc{position:absolute;inset:0}
.pd-pin{position:absolute;left:50%;top:50%;width:26px;height:34px;margin:-34px 0 0 -13px;pointer-events:none;z-index:1}
.pd-pin svg{width:100%;height:100%;display:block}
.pd-pin path{fill:#111;stroke:#fff;stroke-width:1.6}
.pd-pin circle{fill:#fff}
.pd-mapcap{position:absolute;left:10px;top:10px;z-index:1;display:inline-flex;align-items:center;gap:4px;max-width:calc(100% - 20px);padding:5px 10px 5px 7px;border-radius:999px;background:rgba(0,0,0,.55);border:1px solid rgba(255,255,255,.35);color:#fff;font:600 13px var(--font);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none}
.pd-mapcap svg{width:14px;height:14px;flex:none;fill:none;stroke:#fff;stroke-width:1.8}
.pd-mapapp{align-self:flex-start;display:inline-flex;align-items:center;gap:4px;color:var(--text2);text-decoration:none}
.pd-mapapp:hover{color:var(--text);text-decoration:underline}
.pd-mapapp .icon{width:14px;height:14px}
/* Like and save counts on the owner's photo open who liked and saved. */
.pd-ppl{all:unset;cursor:pointer;color:inherit;font:inherit}
.pd-ppl:hover{color:var(--text);text-decoration:underline}
.pd-ppl:focus-visible{outline:2px solid var(--text);outline-offset:2px;border-radius:2px}
.pp-dlg{width:min(480px,calc(100vw - 32px));height:min(640px,80vh);display:none;flex-direction:column}
.pp-dlg[open]{display:flex}
.pp-head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:6px 8px 0 16px;border-bottom:1px solid var(--hairline)}
.pp-tabs{display:flex;gap:20px}
.pp-tabs [role=tab]{all:unset;cursor:pointer;padding:12px 0 10px;font:600 15px var(--font);color:var(--text2);border-bottom:1.5px solid transparent;margin-bottom:-1px}
.pp-tabs [role=tab] .n{font-size:13px;font-weight:500}
.pp-tabs [role=tab][aria-selected=true]{color:var(--text);border-bottom-color:var(--text)}
.pp-tabs [role=tab]:focus-visible{outline:2px solid var(--text);outline-offset:2px}
.pp-pane{flex:1;overflow-y:auto;padding:4px 0 12px}
.pp-notice{display:flex;align-items:center;gap:6px;padding:12px 16px 4px}
.pp-notice .icon{width:14px;height:14px;flex:none}
.pp-list{list-style:none;margin:0;padding:0}
.pp-row{display:flex;align-items:center;gap:12px;min-height:60px;padding:0 16px}
.pp-row .avatar{width:40px;height:40px;margin:0;flex:none;color:var(--text2);text-decoration:none}
.pp-who{flex:1;min-width:0;display:flex;flex-direction:column}
.pp-nm{font:600 15px var(--font);color:var(--text);text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
a.pp-nm:hover{text-decoration:underline}
.pp-who .caption{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pp-when{flex:none}
.pp-follow{height:30px;padding:0 14px;border-radius:999px;border:1px solid var(--text);background:var(--text);color:var(--ground);font:700 13px var(--font);cursor:pointer;white-space:nowrap;flex:none}
.pp-follow.on{background:transparent;color:var(--text);border-color:var(--chip)}
.pp-empty{display:flex;flex-direction:column;align-items:center;gap:6px;padding:56px 24px;text-align:center}
.pp-empty .icon{width:36px;height:36px;color:var(--text2);margin-bottom:6px}
.pp-err{padding:16px;text-align:center}
@media (max-width:640px){
  .pp-dlg{width:100vw;max-width:100vw;height:80vh;max-height:80vh;margin:auto 0 0;border-radius:16px 16px 0 0;border-bottom:0}
}
.pd-comments{display:flex;flex-direction:column;gap:12px;border-top:1px solid var(--hairline);padding-top:16px}
.pd-comments h2{margin:0}
.pd-clist{display:flex;flex-direction:column;gap:14px}
.pd-c{display:flex;gap:10px}
.pd-c .avatar{width:28px;height:28px;font-size:11px}
.pd-c.reply .avatar{width:24px;height:24px;font-size:10px}
.pd-cmain{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.pd-chead{margin:0;display:flex;align-items:center;gap:6px;font-size:13px}
.pd-ctag{font-size:11px;font-weight:600;color:var(--text2);border:1px solid var(--chip);border-radius:4px;padding:0 5px}
.pd-cbody{margin:0;font-size:14px;line-height:1.5;white-space:pre-line}
.pd-cacts{display:flex;align-items:center;gap:12px;margin:2px 0 0!important}
.pd-clike{border:0;background:transparent;color:var(--text2);padding:0;display:flex;align-items:center;gap:3px;cursor:pointer;font:600 12px var(--font)}
.pd-clike .icon{width:16px;height:16px}
.pd-replies{display:flex;flex-direction:column;gap:10px;margin-top:8px}
.pd-rmore{align-self:flex-start;margin-top:6px}
.pd-cform{display:flex;flex-direction:column;gap:6px;margin:0}
.pd-replying{display:flex;gap:8px;align-items:center}
.pd-cin{min-height:42px;border:1px solid var(--chip);border-radius:21px;display:flex;align-items:flex-end;padding:4px 4px 4px 16px;gap:4px;color:var(--text2);font-size:14px;text-decoration:none}
.pd-cin.login{align-items:center;padding:0 16px}
.pd-cin:focus-within{border-color:var(--text)}
.pd-cin textarea{flex:1;min-width:0;border:0;outline:0;background:transparent;resize:none;font:14px/1.5 var(--font);color:var(--text);padding:6px 0;max-height:160px}
.pd-cin .ib{width:34px;height:34px}
.pd-cin .ib .icon{width:20px;height:20px}

@media (max-width:1100px){
  .pw-wall{columns:2;column-gap:20px}
  .pw-wall.cols2{columns:1;max-width:720px;margin:0 auto}
  .pw-wall.laid{gap:20px}
  .pw-grid{grid-template-columns:repeat(4,1fr)}
  .pd-grid{grid-template-columns:1fr}
  .pd-panel{position:static;max-width:720px}
}
@media (max-width:640px){
  .pw-wall,.pw-wall.cols2{columns:1}
  .pw-bar{margin:10px -16px 16px;padding-left:16px}
  .pw-bar .subtabs a{padding:8px 10px 12px;font-size:14px}
  .pw-bar .subtabs{-webkit-mask-image:linear-gradient(90deg,#000 88%,transparent);mask-image:linear-gradient(90deg,#000 88%,transparent)}
  .pw-sortbtn{padding-right:16px}
  .pw-sortbtn span{display:none}
  .pw-grid{grid-template-columns:repeat(3,1fr);margin:0 -16px}
  .pd-stage{margin:0 -16px;max-height:none}
  .pd-stage img{max-height:none;width:100%}
  .pd-nav{display:none}
}

/* archive — the owner's photos (archive.go, mock .impeccable/mocks/desktop-web/archive-v2.html P1) */
.ar .ph{justify-content:flex-start;align-items:baseline;gap:12px}
.ar .ph .caption{font-size:13px;font-weight:500;letter-spacing:.02em;color:var(--text2)}
.ar .caption{font-size:13px;font-weight:500;line-height:1.5;color:var(--text2);margin:0}
.ar .subtabs{margin:14px 0 16px}
.ar-tools{display:flex;align-items:center;gap:8px;margin:0 0 14px;flex-wrap:wrap}
.ar-grow{flex:1}
.ar-chips{display:flex;gap:6px;flex-wrap:wrap}
.ar-chip{height:32px;padding:0 12px;border:1px solid var(--chip);border-radius:999px;display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--text);text-decoration:none;white-space:nowrap}
.ar-chip:hover{border-color:var(--text)}
.ar-chip .n{font-size:12px;font-weight:500;color:var(--text2)}
.ar-chip.on{background:var(--text);border-color:var(--text);color:var(--ground)}
.ar-chip.on .n{color:var(--ground);opacity:.62}
.ar-chip.zero:not(.on){opacity:.45}
.ar-group{position:relative;flex:none}
.ar-group>summary{list-style:none}
.ar-group>summary::-webkit-details-marker{display:none}
.ar-groupbtn{height:34px;padding:0 10px 0 12px;border:1px solid var(--chip);border-radius:6px;display:inline-flex;align-items:center;gap:4px;font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap}
.ar-groupbtn:hover{border-color:var(--text)}
.ar-groupbtn .icon{width:16px;height:16px;stroke-width:2;color:var(--text2)}
.ar-group[open] .ar-groupbtn .icon{transform:rotate(180deg)}
.ar-menu{position:absolute;right:0;top:calc(100% + 4px);z-index:25;width:250px;background:var(--menu);border:1px solid var(--rule);border-radius:12px;overflow:hidden}
.ar-menuh{margin:0;padding:10px 14px 6px;font-size:11px;font-weight:600;letter-spacing:.08em;color:var(--text2)}
.ar-menu a{display:flex;align-items:center;gap:10px;padding:11px 14px;border-top:1px solid var(--rule);text-decoration:none;color:var(--text)}
.ar-menu a:hover{background:var(--tile)}
.ar-menu a span{flex:1;display:flex;flex-direction:column;gap:1px}
.ar-menu b{font-size:15px;font-weight:600}
.ar-menu small{font-size:12px;color:var(--text2)}
.ar-menu .mk{width:18px;height:18px;stroke-width:2.2}
.ar-msel{display:none;margin:0;gap:6px;align-items:center}
.ar-msel .sel{height:34px}
.ar-notice{display:flex;align-items:flex-start;gap:10px;margin:0 0 14px;padding:11px 6px 11px 12px;background:var(--tile);border:1px solid var(--rule);border-radius:10px}
.ar-notice .tri{width:18px;height:18px;margin-top:1px;color:var(--red);stroke-width:2}
.ar-notice p{flex:1;margin:0;font-size:13px;line-height:1.5}
.ar-notice .ar-x{width:32px;height:32px;margin:-6px 0;color:var(--text2)}
.ar-notice .ar-x .icon{width:18px;height:18px}
.ar-wrap{display:block}
.ar-wrap.nav{display:grid;grid-template-columns:minmax(0,1fr) 150px;gap:20px;align-items:start}
.ar-main{min-width:0;transition:opacity .15s}
.ar.busy .ar-main{opacity:.5}
.ar-day{display:block}
.ar-dayh{position:sticky;top:var(--hdr);z-index:3;margin:0;background:var(--ground);display:flex;align-items:baseline;gap:8px;padding:12px 0 8px}
.ar-dayh b{font-size:15px;font-weight:700}
.ar-dayh .n{font-size:12px;font-weight:500;color:var(--text2)}
.ar-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:2px;margin-bottom:8px}
.ar-tile{position:relative;display:block;aspect-ratio:1;background:var(--tile);overflow:hidden}
.ar-tile img{width:100%;height:100%;object-fit:cover;display:block}
.ar-tile:focus-visible{outline-offset:-2px}
.ar-tile.review img{filter:blur(6px);transform:scale(1.1)}
.ar-tile.hidden img{opacity:.45}
.ar-veil,.ar-band{position:absolute;left:0;right:0;bottom:0;height:26px;background:rgba(0,0,0,.55);color:#F2F2F2;font:500 12px var(--font);display:flex;align-items:center;gap:6px;padding:0 8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ar-veil .dot{width:6px;height:6px;border-radius:50%;background:var(--red);flex:none}
.ar-band.lock{gap:4px;padding:0 6px}
.ar-band .icon{width:11px;height:11px;stroke-width:2.6;flex:none}
.ar-bdg{position:absolute;right:6px;bottom:6px;width:22px;height:22px;border-radius:50%;background:rgba(0,0,0,.62);box-shadow:inset 0 0 0 1px rgba(255,255,255,.18);color:#F2F2F2;display:flex;align-items:center;justify-content:center}
.ar-bdg.pub{background:#F2F2F2;box-shadow:none;color:#0B0B0B}
.ar-bdg .icon{width:13px;height:13px;stroke-width:2.2}
.ar-bdg .icon.lk{stroke-width:2.4}
.ar-ai{position:absolute;left:6px;bottom:6px;height:20px;padding:0 7px;border-radius:999px;background:rgba(0,0,0,.62);color:#F2F2F2;font:600 11px var(--font);display:flex;align-items:center;white-space:nowrap}
.ar-exif{padding:12px 0 4px;max-width:640px}
.ar-newer{display:flex;align-items:center;justify-content:center;gap:6px;height:44px;font-size:13px;font-weight:600;color:var(--text2);text-decoration:none}
.ar-newer:hover{color:var(--text)}
.ar-newer .icon{width:14px;height:14px;stroke-width:2.2}
.ar-next{display:flex;flex-direction:column;align-items:center;gap:10px;padding:24px 0 8px}
.ar-next .btn-quiet{background:transparent;cursor:pointer}
.ar-empty{display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;padding:96px 16px}
.ar-empty>.icon{width:40px;height:40px;color:var(--text2);stroke-width:1.3}
.ar-empty b{font-size:17px;font-weight:700}
.ar-empty .btn-quiet{margin-top:8px}
.ar-intro{max-width:480px;margin:0 auto;padding:56px 0 72px}
.ar-intro h2{margin:0 0 8px;font-size:22px;font-weight:700;line-height:1.3}
.ar-intro p{margin:0 0 24px;font-size:15px;line-height:1.6;color:var(--text2)}
.ar-side{position:sticky;top:calc(var(--hdr) + 16px);height:calc(100vh - var(--hdr) - 40px);max-height:720px;display:grid;grid-template-columns:minmax(0,1fr) 18px;gap:6px}
.ar-months{overflow-y:auto;display:flex;flex-direction:column;gap:1px;border-left:1px solid var(--hairline);padding:0 0 0 12px;scrollbar-width:thin}
.ar-months a{font-size:12px;font-weight:500;line-height:1.3;color:var(--text2);padding:4px 0;text-decoration:none;white-space:nowrap}
.ar-months a:hover{color:var(--text)}
.ar-months a.on{color:var(--text);font-weight:700}
.ar-scrub{position:relative;cursor:ns-resize;touch-action:none;border-radius:4px}
.ar-scrub .track{position:absolute;top:8px;bottom:8px;right:4px;width:2px;background:var(--hairline)}
.ar-scrub i{position:absolute;right:0;width:5px;height:1.5px;background:var(--chip)}
.ar-scrub i.long{width:9px;background:var(--text2)}
.ar-scrub .thumb{position:absolute;right:-1px;width:4px;height:36px;border-radius:2px;background:var(--text);transform:translateY(-50%)}
.ar-scrub .cap{position:absolute;right:14px;transform:translateY(-50%);white-space:nowrap;background:var(--text);color:var(--ground);font:700 13px var(--font);padding:6px 10px;border-radius:999px;pointer-events:none;z-index:4}
/* archive selection (mock archive-v2.html P2·P3·P5, archive-clients §5–7) */
.ar-selbtn{order:9;background:transparent;color:var(--text);font:600 13px var(--font)}
.ar-selhint{margin:0 0 14px;min-height:34px;display:flex;align-items:center}
.ar.selecting .ar-tile{cursor:pointer;user-select:none;-webkit-user-select:none}
.ar.selecting .ar-tile:hover img{filter:brightness(.92)}
.ar.bulk .ar-main{pointer-events:none}
.ar-ck{display:none;position:absolute;right:6px;top:6px;width:22px;height:22px;border-radius:50%;background:rgba(0,0,0,.25);box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.9);align-items:center;justify-content:center;color:transparent}
.ar-ck .icon{width:14px;height:14px;stroke-width:3.4}
.ar.selecting .ar-ck{display:flex}
.ar-tile.on{background:#1A1A1A}
.ar-tile.on img{transform:scale(.88)}
.ar-tile.on.review img{transform:scale(.88)}
.ar-tile img{transition:transform .15s}
.ar-tile.on::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 2px var(--text);pointer-events:none}
.ar-tile.on .ar-ck{background:var(--text);box-shadow:none;color:var(--ground)}
.ar-daysel{margin-left:auto;border:0;background:transparent;padding:4px 0 4px 12px;font:600 13px var(--font);color:var(--text);cursor:pointer;min-height:32px}
.ar-daysel.run{color:var(--text2);cursor:default}
.ar-bar{position:sticky;bottom:0;z-index:20;margin-top:12px;background:var(--ground);border-top:1px solid var(--hairline);display:flex;align-items:center;gap:6px;padding:10px 0 calc(10px + env(safe-area-inset-bottom,0px))}
.ar-barinfo{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.ar-barinfo b{font-size:15px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ar-barinfo span{font-size:12px;color:var(--text2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ar-slots{display:flex;gap:2px}
.ar-slot{position:relative;min-width:84px;height:54px;border:0;border-radius:6px;background:transparent;color:var(--text);font:600 11px var(--font);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;cursor:pointer;padding:0 4px}
.ar-slot:hover:not(:disabled){background:var(--tile)}
.ar-slot:disabled{opacity:.35;cursor:default}
.ar-slot .icon{width:24px;height:24px}
.ar-slot .lb{white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.ar-slot .pill{width:40px;height:28px;border-radius:999px;background:var(--text);color:var(--ground);display:flex;align-items:center;justify-content:center}
.ar-slot .pill .icon{width:18px;height:18px;stroke-width:2}
.ar-slot.del{color:var(--red)}
.ar-slot em{position:absolute;top:2px;left:calc(50% + 8px);min-width:17px;height:17px;padding:0 5px;border-radius:999px;background:var(--text);color:var(--ground);font:700 10.5px/17px var(--font);font-style:normal;text-align:center}
.ar-slot.pub em{left:calc(50% + 14px);background:var(--ground);color:var(--text);box-shadow:inset 0 0 0 1px var(--text)}
.ar-slot.run .icon,.ar-slot.run .pill{opacity:.35}
.ar-slot.run::before{content:"";position:absolute;top:9px;left:50%;width:18px;height:18px;margin-left:-9px;border-radius:50%;border:2px solid var(--text2);border-top-color:transparent;animation:ar-spin .8s linear infinite}
@keyframes ar-spin{to{transform:rotate(360deg)}}
.ar-cancel{flex:none;margin-left:6px;background:transparent;cursor:pointer}
.ar-dlg{border:1px solid var(--hairline);border-radius:10px;background:var(--menu);color:var(--text);padding:22px 24px;width:min(460px,calc(100vw - 32px));max-height:calc(100vh - 48px);overflow:auto}
.ar-dlg::backdrop{background:rgba(0,0,0,.6)}
.ar-dlg h2{margin:0;font-size:20px;font-weight:800;line-height:1.3}
.ar-dlg .caption{font-size:13px;color:var(--text2);margin:0}
.ar-dlg .acts{display:flex;justify-content:flex-end;gap:8px;margin-top:20px;flex-wrap:wrap}
.ar-dlg .btn-quiet{background:transparent;cursor:pointer;color:var(--text)}
.ar-del{position:relative;overflow:hidden}
.ar-del::backdrop{background:rgba(0,0,0,.72)}
.ar-del .redline{position:absolute;left:0;right:0;top:0;height:2px;background:var(--red)}
.ar-del .warn{width:40px;height:40px;border-radius:50%;background:rgba(216,50,42,.16);color:var(--red);display:flex;align-items:center;justify-content:center;margin-bottom:10px}
.ar-del .warn .icon{width:22px;height:22px;stroke-width:2}
.ar-del .strip{display:flex;align-items:center;margin:8px 0 14px;padding-left:10px}
.ar-del .strip img,.ar-del .strip>span:not(.more){width:46px;height:46px;object-fit:cover;border-radius:4px;border:2px solid var(--menu);margin-left:-10px;background:var(--tile);display:block}
.ar-del .strip .more{margin-left:10px}
.ar-del .wl{list-style:none;margin:0;padding:0}
.ar-del .wl li{position:relative;border-top:1px solid var(--rule);padding:8px 0 8px 18px;font-size:14px;line-height:1.5}
.ar-del .wl li::before{content:"!";position:absolute;left:2px;top:8px;color:var(--red);font-weight:700}
.ar-del .wl li.i::before{content:"i";color:var(--text2)}
.btn-red{position:relative;overflow:hidden;height:40px;padding:0 16px;border:0;border-radius:6px;background:var(--red);color:#fff;font:600 15px var(--font);display:inline-flex;align-items:center;gap:8px;cursor:pointer;touch-action:none;user-select:none;-webkit-user-select:none}
.btn-red .icon{width:18px;height:18px;position:relative}
.btn-red .t{position:relative}
.btn-red:disabled{opacity:.6;cursor:default}
.btn-red .fill{position:absolute;inset:0;background:rgba(255,255,255,.22);transform:scaleX(0);transform-origin:left;transition:transform .2s linear}
.btn-red.holding .fill{transform:scaleX(1);transition:transform 1s linear}
.btn-red.run .icon{animation:ar-spin .8s linear infinite}
.ar-holdhint{text-align:right;margin-top:8px!important}
.ar-geo{width:min(720px,calc(100vw - 32px));padding:18px 20px 20px}
.ar-geo::backdrop{background:rgba(0,0,0,.45)}
.ar-geoh{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:10px}
.ar-geoh h2{font-size:18px;font-weight:700}
.ar-geoh .ib{margin:-8px -10px 0 0}
#ar-geo-note{margin:0 0 10px}
.ar-geos{position:relative;margin-bottom:10px}
.ar-geoq{height:42px;border:1px solid var(--chip);border-radius:999px;display:flex;align-items:center;gap:8px;padding:0 14px;color:var(--text2)}
.ar-geoq:focus-within{border-color:var(--text)}
.ar-geoq .icon{width:18px;height:18px}
.ar-geoq input{flex:1;min-width:0;border:0;outline:0;background:transparent;font:15px var(--font);color:var(--text)}
.ar-geores{position:absolute;left:0;right:0;top:46px;z-index:5;list-style:none;margin:0;padding:6px;background:var(--menu);border:1px solid var(--rule);border-radius:10px;max-height:260px;overflow:auto}
.ar-geores li{padding:8px 10px;border-radius:6px;cursor:pointer;display:flex;flex-direction:column;gap:1px;outline:0}
.ar-geores li[data-place]:hover,.ar-geores li[data-place]:focus{background:var(--tile)}
.ar-geores b{font-size:14px;font-weight:600}
.ar-geores span{font-size:12px;color:var(--text2)}
.ar-geores li.pg{cursor:default;font-size:11px;color:var(--text2);text-align:right;padding:4px 10px}
.ar-geores li.none{cursor:default;font-size:13px;color:var(--text2)}
.ar-map{position:relative;height:320px;background:var(--tile);border-radius:8px;overflow:hidden}
.ar-mapc{position:absolute;inset:0}
.ar-pin{position:absolute;left:50%;top:50%;width:30px;height:38px;margin:-38px 0 0 -15px;pointer-events:none;transition:transform .15s;filter:drop-shadow(0 2px 2px rgba(0,0,0,.35))}
.ar-pin svg{width:100%;height:100%}
.ar-pin path{fill:#fff;stroke:#111;stroke-width:1.2}
.ar-pin circle{fill:var(--red)}
.ar-map.lift .ar-pin{transform:translateY(-12px);filter:drop-shadow(0 10px 6px rgba(0,0,0,.3))}
.ar-geocard{display:flex;flex-direction:column;gap:2px;padding:12px 2px 0;min-height:52px}
.ar-geocard b{font-size:15px;font-weight:700}
.ar-geocard b:empty{display:none}
.ar-geoerr{margin:8px 0 0;font-size:13px;color:var(--red)}
.ar-geoconfirm{display:flex;flex-direction:column;gap:6px}
.ar-geoconfirm .gl{width:40px;height:40px;border-radius:50%;background:var(--tile);display:flex;align-items:center;justify-content:center;margin-bottom:4px}
.ar-geoconfirm h3{margin:0;font-size:18px;font-weight:700}
.ar-georows{list-style:none;margin:8px 0 0;padding:0}
.ar-georows li{display:flex;align-items:center;gap:10px;padding:8px 0;border-top:1px solid var(--rule)}
.ar-georows img,.ar-georows li>span:first-child:empty{width:40px;height:40px;object-fit:cover;border-radius:4px;background:var(--tile);flex:none}
.ar-georows li>span:last-child{display:flex;flex-direction:column;min-width:0}
.ar-georows b{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ar-georows small{font-size:12px;color:var(--text2)}
.ar-toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:60;width:min(560px,calc(100vw - 32px));background:var(--text);color:var(--ground);border-radius:10px;padding:12px 14px;display:flex;align-items:center;gap:10px;font-size:14px;font-weight:600}
.ar-toast .icon{width:18px;height:18px;stroke-width:2.2;flex:none}
.ar-toast .t{flex:1;min-width:0}
.ar-toast .u{border:0;background:transparent;color:inherit;font:700 14px var(--font);text-decoration:underline;text-underline-offset:3px;cursor:pointer;min-height:32px;padding:0 4px}
.ar.selecting~.ar-toast,.ar-toast.up{bottom:96px}
@media (prefers-reduced-motion:reduce){
  .btn-red .fill,.btn-red.holding .fill{transition:none}
  .btn-red.holding .fill{transform:scaleX(.5)}
  .ar-slot.run::before,.btn-red.run .icon{animation:none}
}
@media (max-width:640px){
  .ar-bar{flex-wrap:wrap;margin:12px -16px 0;padding:8px 8px calc(8px + env(safe-area-inset-bottom,0px))}
  .ar-barinfo{order:1;padding-left:8px}
  .ar-cancel{order:2;height:34px}
  .ar-slots{order:3;flex-basis:100%;justify-content:space-between}
  .ar-slot{min-width:0;flex:1}
  .ar-map{height:240px}
  .ar-dlg{padding:20px 18px}
}
/* my-photo search (search.go, mock archive-v2.html P6) */
.ar-srchbtn{text-decoration:none;color:var(--text);gap:6px}
.ar-srchbtn .icon{width:16px;height:16px;color:var(--text)}
.sr-form{position:relative;display:flex;align-items:center;gap:8px;margin:0 0 14px}
.sr-box{flex:1;min-width:0;min-height:42px;border:1px solid var(--chip);border-radius:999px;display:flex;align-items:center;flex-wrap:wrap;gap:6px;padding:4px 6px 4px 14px;color:var(--text2)}
.sr-box:focus-within{border-color:var(--text)}
.sr-box>.icon{width:18px;height:18px}
.sr-chips{display:contents}
.sr-chip{height:28px;display:inline-flex;align-items:center;gap:2px;padding:0 4px 0 10px;border-radius:999px;background:var(--text);color:var(--ground);font-size:13px;font-weight:600;white-space:nowrap}
.sr-chip .x{border:0;background:transparent;color:inherit;width:22px;height:22px;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;border-radius:50%}
.sr-chip .x .icon{width:13px;height:13px;stroke-width:2.2}
.sr-box input{flex:1;min-width:120px;border:0;outline:0;background:transparent;font:15px var(--font);color:var(--text);height:32px}
.sr-box input::-webkit-search-cancel-button{display:none}
.sr-clear{width:32px;height:32px;color:var(--text2)}
.sr-clear .icon{width:16px;height:16px}
.sr-close{flex:none;height:42px}
.sr-sugg{position:absolute;left:0;right:0;top:calc(100% + 4px);z-index:25;background:var(--menu);border:1px solid var(--rule);border-radius:10px;padding:6px;max-height:340px;overflow:auto}
.sr-sugg button{width:100%;display:flex;align-items:center;gap:10px;border:0;background:transparent;color:var(--text);padding:10px;border-radius:6px;font:15px var(--font);cursor:pointer;text-align:left}
.sr-sugg button:hover,.sr-sugg button:focus{background:var(--tile);outline:0}
.sr-sugg button:disabled{opacity:.45;cursor:default}
.sr-sugg button .icon{width:16px;height:16px;color:var(--text2)}
.sr-sugg button span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sr-sugg small{font-size:12px;color:var(--text2)}
.sr-sugg .caption{padding:10px}
.ar.selecting .sr-form{opacity:.45;pointer-events:none}
.sr-home{padding-top:4px}
.sr-sec{margin-bottom:22px}
.sr-sec .h{display:flex;align-items:center;justify-content:space-between;min-height:32px;margin-bottom:4px}
.sr-sec .label,.sr-total{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text2);margin:0}
.sr-recent{list-style:none;margin:0;padding:0}
.sr-recent li{display:flex;align-items:center;border-bottom:1px solid var(--hairline)}
.sr-recent .go{flex:1;min-width:0;display:flex;align-items:center;gap:12px;border:0;background:transparent;color:var(--text);font:15px var(--font);min-height:48px;cursor:pointer;text-align:left;padding:0}
.sr-recent .go .icon{width:18px;height:18px;color:var(--text2)}
.sr-recent .go span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sr-recent .x{width:40px;height:40px;color:var(--text2)}
.sr-recent .x .icon{width:14px;height:14px}
.sr-tags{display:flex;flex-wrap:wrap;gap:8px}
.sr-homehint{text-align:center;padding:64px 16px;max-width:520px;margin:0 auto!important}
.sr-tagrow{display:flex;align-items:center;gap:12px;padding:12px 0;border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline);margin:0 0 12px;text-decoration:none;color:var(--text)}
.sr-tagrow .hs{width:40px;height:40px;border-radius:50%;border:1px solid var(--chip);display:flex;align-items:center;justify-content:center;font-size:17px;font-weight:700;flex:none}
.sr-tagrow .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.sr-tagrow b{font-size:15px}
.sr-tagrow small{font-size:13px;color:var(--text2)}
.sr-tagrow .icon{width:16px;height:16px;color:var(--text2);transform:rotate(-90deg)}
.sr-total{margin:0 0 8px}
.sr .ar-empty{padding:72px 16px}
@media (max-width:640px){
  .sr-form{flex-wrap:wrap}
  .sr-close{height:36px}
  .ar-srchbtn span{display:none}
}
/* albums (album.go, mock archive-v2.html A1–A4·P4) */
.btn-out{height:40px;padding:0 14px;border:1px solid var(--text);border-radius:6px;background:transparent;color:var(--text);font:600 14px var(--font);display:inline-flex;align-items:center;gap:6px;cursor:pointer;white-space:nowrap;text-decoration:none}
.btn-out .icon{width:16px;height:16px;stroke-width:2}
.btn-out:disabled{opacity:.35;cursor:default}
.btn-out.red{border-color:var(--red);color:var(--red)}
.al-tools .caption{font-size:13px;font-weight:500;color:var(--text2)}
.al-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:24px 18px}
.al-card{display:flex;flex-direction:column;gap:2px;text-decoration:none;color:var(--text);min-width:0}
.al-card .cv{position:relative;aspect-ratio:1;background:var(--tile);margin-bottom:8px;display:block;overflow:hidden}
.al-card .cv img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .15s}
.al-card .cv.empty{background:transparent;border:1.5px dashed var(--chip);display:flex;align-items:center;justify-content:center;color:var(--text2);font-size:13px}
.al-card b{font-size:15px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.al-card .d{font-size:13px;color:var(--text2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-height:1.3em}
.al-card .m{font-size:12px;color:var(--text2)}
.al-card:hover b{text-decoration:underline;text-underline-offset:3px}
.al.selecting .al-card .ar-ck{display:flex}
.al.selecting .al-card:hover b{text-decoration:none}
.al-card.on .cv{box-shadow:inset 0 0 0 2px var(--text)}
.al-card.on .cv img{transform:scale(.9)}
.al-card.on .ar-ck{background:var(--text);box-shadow:none;color:var(--ground)}
.al-empty .al-emptyic{width:64px;height:64px;border:1.5px dashed var(--chip);border-radius:6px;display:flex;align-items:center;justify-content:center;color:var(--text2)}
.al-empty .al-emptyic .icon{width:28px;height:28px}
.al-empty .caption{max-width:440px}
.al-pre{white-space:pre-line}
.al-bar .ar-barinfo span{font-size:12px}
.al-head{display:flex;align-items:flex-end;flex-wrap:wrap;gap:8px 16px;margin:0 0 16px}
.al-back{width:100%;display:inline-flex;align-items:center;gap:2px;font-size:13px;font-weight:600;color:var(--text2);text-decoration:none}
.al-back .icon{width:16px;height:16px;transform:rotate(90deg)}
.al-back:hover{color:var(--text)}
.al-ht{flex:1;min-width:0}
.al-ht h2{margin:0;font-size:22px;font-weight:700;line-height:1.3}
.al-ht p{margin:2px 0;color:var(--text2);font-size:14px;white-space:pre-line;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.al-ht .caption{font-size:13px;color:var(--text2)}
.al-dtools{margin:0}
.al-more>summary .icon{width:18px;height:18px}
.al-menu{width:220px;padding:6px}
.al-menu button{width:100%;border:0;background:transparent;color:var(--text);font:500 14px var(--font);text-align:left;padding:9px 10px;border-radius:6px;cursor:pointer}
.al-menu button:hover{background:var(--tile)}
.al-menu button.dg{color:var(--red);border-top:1px solid var(--rule);border-radius:0 0 6px 6px}
.al-list .ar-dayh{display:none}
.ar-cover{position:absolute;left:6px;top:6px;font:700 11px var(--font);background:rgba(0,0,0,.62);color:#fff;padding:3px 7px;border-radius:999px;z-index:1}
.ar.selecting .ar-cover{top:auto;bottom:6px}
.al-form{width:min(480px,calc(100vw - 32px))}
.al-fbody{margin:0;display:flex;flex-direction:column;gap:14px}
.al-f{display:flex;flex-direction:column;gap:4px}
.al-f .lab{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text2)}
.al-f .lab small{letter-spacing:0;text-transform:none;font-weight:500;margin-left:4px}
.al-f input,.al-f textarea{border:0;border-bottom:1px solid var(--rule);background:transparent;font:400 15px var(--font);color:var(--text);padding:7px 0;outline:0;resize:vertical}
.al-f input:focus,.al-f textarea:focus{border-bottom-color:var(--text)}
.al-cvpick{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.al-cvb{position:relative;width:56px;height:56px;padding:0;border:0;background:var(--tile);cursor:pointer;opacity:.6;overflow:hidden;border-radius:2px}
.al-cvb img{width:100%;height:100%;object-fit:cover;display:block}
.al-cvb.on{opacity:1;outline:2px solid var(--text);outline-offset:2px}
.al-cvb .tag{position:absolute;left:0;right:0;bottom:0;background:rgba(0,0,0,.62);color:#fff;font:700 10px/16px var(--font);text-align:center}
.al-err{margin:0;font-size:13px;color:var(--red)}
.al-confirm{width:min(400px,calc(100vw - 32px))}
.al-confirm h2{font-size:17px;font-weight:700}
.al-picker,.al-cover{width:min(1100px,calc(100vw - 32px));height:calc(100vh - 48px);max-height:none;padding:18px 20px 0;display:flex;flex-direction:column;overflow:hidden}
.al-picker:not([open]),.al-cover:not([open]){display:none}
.al-pkh{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}
.al-pkh h2{font-size:18px;font-weight:700}
.al-pkq{flex:none;margin-bottom:10px}
.al-pkt{display:flex;align-items:center;gap:8px;margin-bottom:10px;flex-wrap:wrap}
.al-pkt .ar-chip{cursor:pointer;background:transparent;font-family:var(--font)}
.al-pkt .ar-chip.on{background:var(--text)}
.al-pkbody{flex:1;min-height:0;overflow-y:auto;margin:0 -20px;padding:0 20px}
.al-pkmsg{padding:24px 0;text-align:center}
.al-pklist .ar-dayh{top:0;background:var(--menu)}
.al-pklist .ar-grid{grid-template-columns:repeat(auto-fill,minmax(130px,1fr))}
.al-pklist .ar-ck{display:flex}
.al-pklist .ar-tile{cursor:pointer}
.al-pklist .ar-tile.nopick{cursor:default}
.al-pklist .ar-tile.nopick .ar-ck{display:none}
.al-pklist .ar-tile.added img{opacity:.35}
.al-pklist .ar-tile.on{background:#1A1A1A}
.al-pklist .ar-tile.on img{transform:scale(.88)}
.al-pklist .ar-tile.on::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 2px var(--text);pointer-events:none}
.al-pklist .ar-tile.on .ar-ck{background:var(--text);box-shadow:none;color:var(--ground)}
.al-added{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#fff;font:600 12px var(--font);background:rgba(0,0,0,.35)}
.al-picked{flex:none;border-top:1px solid var(--rule);padding:10px 0;max-height:160px;overflow:auto}
.al-pickedh{font-size:13px;margin-bottom:6px}
.al-pickedgrid{display:flex;flex-wrap:wrap;gap:6px}
.al-pickedgrid .al-cvb{opacity:1}
.al-picker .al-err{flex:none;padding:6px 0}
.al-pkbar{flex:none;display:flex;align-items:center;gap:10px;border-top:1px solid var(--rule);margin:0 -20px;padding:12px 20px}
.al-pkn{border:0;background:transparent;padding:0;font:700 15px var(--font);color:var(--text);cursor:pointer;text-align:left}
.al-pkn:disabled{cursor:default}
.al-addto{width:min(520px,calc(100vw - 32px))}
.al-albl{list-style:none;margin:12px 0 0;padding:0;max-height:min(420px,60vh);overflow:auto}
.al-albl button{width:100%;display:flex;align-items:center;gap:12px;padding:10px 4px;border:0;border-bottom:1px solid var(--hairline);background:transparent;color:var(--text);cursor:pointer;text-align:left;font-family:var(--font)}
.al-albl button:hover{background:var(--tile)}
.al-albl .cv{width:56px;height:56px;flex:none;background:var(--tile);overflow:hidden;display:flex;align-items:center;justify-content:center}
.al-albl .cv img{width:100%;height:100%;object-fit:cover}
.al-albl .cv.plus{background:transparent;border:1.5px dashed var(--chip);color:var(--text2)}
.al-albl .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.al-albl b{font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.al-albl small{font-size:12px;color:var(--text2)}
.al-albl em{font-style:normal;font-size:11px;font-weight:600;border:1px solid var(--chip);border-radius:999px;padding:2px 8px;color:var(--text2);white-space:nowrap}
@media (max-width:640px){
  .al-cards{grid-template-columns:repeat(2,1fr);gap:18px 12px}
  .al-picker,.al-cover{width:100vw;height:100vh;max-width:none;border-radius:0;padding:14px 16px 0}
  .al-pkbody,.al-pkbar{margin:0 -16px;padding-left:16px;padding-right:16px}
  .al-pklist .ar-grid{grid-template-columns:repeat(3,1fr)}
  .al-head .al-dtools{width:100%}
}
/* my photo on the photo page and the viewing mode (detail.go, mock archive-v2 D1, viewer-v1) */
.pd-owni{justify-content:flex-end}
.pd-ownmenu{position:relative}
.pd-ownmenu>summary{list-style:none}
.pd-ownmenu>summary::-webkit-details-marker{display:none}
.pd-menu{right:0;left:auto}
.pd-menu a{display:block;padding:9px 10px;border-radius:6px;font:500 14px var(--font);color:var(--text);text-decoration:none}
.pd-menu a:hover{background:var(--tile)}
.pd-reason{margin:12px 0 0;padding:10px 12px;border:1px solid var(--rule);border-left:2px solid var(--text2);font-size:13px;line-height:1.5}
.pd-ownbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:20px;padding:12px 0;border-top:1px solid var(--hairline)}
.pd-ownbar .st{flex:1;min-width:0;display:flex;align-items:center;gap:6px;font-size:13px;color:var(--text2)}
.pd-ownbar .st .icon{width:16px;height:16px;color:var(--text)}
.pd-ownbar .dot{width:6px;height:6px;border-radius:50%;background:var(--red);flex:none}
.pd-ownbar .btn-ink2{border-radius:999px;gap:6px;height:38px}
.pd-ownbar .btn-ink2 .icon{width:16px;height:16px}
.pd-edit{width:min(560px,calc(100vw - 32px))}
.pd-edit select{border:0;border-bottom:1px solid var(--rule);background:transparent;color:var(--text);font:15px var(--font);padding:7px 0}
.pd-edit select option{background:var(--menu);color:var(--text)}
.pd-tagbox{display:flex;flex-wrap:wrap;gap:6px;align-items:center;border-bottom:1px solid var(--rule);padding:6px 0}
.pd-tagbox input{flex:1;min-width:120px;border:0;outline:0;background:transparent;color:var(--text);font:15px var(--font);padding:4px 0}
.pd-suggest{display:flex;flex-direction:column;gap:6px;align-items:flex-start}
.pd-viewer{position:fixed;inset:0;z-index:100;background:#000;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
.pd-vcanvas{position:absolute;inset:0;display:block}
.pd-vbtn{position:absolute;top:16px;height:44px;border:0;border-radius:22px;background:rgba(0,0,0,.45);color:#F2F2F2;display:flex;align-items:center;gap:8px;padding:0 14px;font:600 15px var(--font);cursor:pointer;transition:opacity .2s}
.pd-vbtn svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.pd-vclose{left:16px;width:44px;padding:0;justify-content:center}
.pd-vheart{right:16px}
.pd-vheart.on svg{fill:#D8322A;stroke:#D8322A}
.pd-vbtn:focus-visible{outline:2px solid #F2F2F2;outline-offset:2px}
.pd-viewer.idle .pd-vbtn{opacity:0}
.pd-viewer.idle .pd-vbtn:focus-visible{opacity:1}
.pd-viewer.idle{cursor:none}
html.pd-lock,html.pd-lock body{overflow:hidden}
@media (prefers-reduced-motion:reduce){.pd-vbtn{transition:none}}
@media print{.pd-viewer,.pd-stage img{display:none!important}}
@media (max-width:1100px){
  .ar-wrap.nav{grid-template-columns:minmax(0,1fr) 120px;gap:14px}
}
@media (max-width:640px){
  .ar .subtabs{margin:10px -16px 12px}
  .ar-wrap.nav{display:block}
  .ar-side{display:none}
  .ar-msel{display:flex;margin-right:auto}
  .ar-grid{grid-template-columns:repeat(3,1fr);margin:0 -16px 8px}
  .ar-dayh{padding:10px 0 6px}
  .ar-intro{padding:32px 0 48px}
  .ar-groupbtn{padding:0 8px 0 10px}
}
.sr .ar-dayh{display:none}
.ar.selecting .sr-tagrow{display:none}
.al-dtools .al-more{order:10}
@media (max-width:640px){.al-pkbar .ar-barinfo{order:0;padding-left:0}}

/* ranking — Top Rank and the author pages /@{handle} (rank.go, author.go; mock .impeccable/mocks/desktop-web/rank-v1.html) */
.pw a.avatar,.pw a.name,.pd-cname{text-decoration:none;color:inherit}
.pw a.name:hover .nm:not(.pod),.pd-cname:hover .nm:not(.pod){text-decoration:underline;text-underline-offset:3px}
.shine{background-size:50% 100%,100% 100%;background-repeat:no-repeat;animation:rk-shine 2.4s ease-in-out 1 .4s both}
.shine.pod1{background-image:linear-gradient(100deg,transparent,rgba(255,246,216,.9),transparent),linear-gradient(100deg,#B07E12,#7E5A0C 55%,#B07E12)}
:root[data-theme="dark"] .shine.pod1{background-image:linear-gradient(100deg,transparent,rgba(255,246,216,.9),transparent),linear-gradient(100deg,#F2D27A,#C9982E 55%,#F2D27A)}
@keyframes rk-shine{0%{background-position:-100% 0,0 0}60%,100%{background-position:250% 0,0 0}}
@media (prefers-reduced-motion:reduce){.shine{animation:none;background-size:0 0,100% 100%}}
.rkh{display:flex;align-items:center;gap:8px}
.rk-info{width:36px;height:36px;display:flex;align-items:center;justify-content:center;border:0;background:transparent;color:var(--text2);border-radius:50%;cursor:pointer;padding:0}
.rk-info:hover{color:var(--text);background:var(--tile)}
.rk-info .icon{width:20px;height:20px}
.rk-bar{display:flex;align-items:flex-end;gap:8px;margin:14px 0 24px;border-bottom:1px solid var(--hairline)}
.rk-bar .subtabs{margin:0;border:0;flex:1;min-width:0}
.rk-asof{flex:none;padding:0 2px 13px;font-size:12px!important;white-space:nowrap}
.rk-asof2{display:none}
.rk-heart{display:flex;flex-direction:column;align-items:flex-end;gap:1px;flex:none}
.rk-heart .n{display:flex;align-items:center;gap:4px;font-size:13px;font-weight:500;color:var(--text)}
.rk-heart .n .icon{width:16px;height:16px;stroke-width:1.8;color:var(--text2)}
.rk-heart.on .n .icon{fill:var(--red);stroke:var(--red)}
.rk-heart .w{font-size:12px;font-weight:500;color:var(--text2)}
/* photos: #1 full width 16:9, #2 #3 below in 3:2, never cropped */
.rk-pp{display:flex;flex-direction:column;gap:28px;padding-bottom:24px;border-bottom:1px solid var(--hairline)}
.rk-23{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.rk-pc{display:flex;flex-direction:column;gap:10px;min-width:0}
.rk-fit{position:relative;display:block;background:var(--ground);overflow:hidden;aspect-ratio:3/2}
.rk-pc.p1 .rk-fit{aspect-ratio:16/9}
.rk-fit img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;display:block}
.rk-prow{display:flex;align-items:flex-start;gap:12px}
.rk-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.rk-ttl{font-size:17px;font-weight:400;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-decoration:none;color:var(--text)}
.rk-pc.p23 .rk-ttl,.rk-row .rk-ttl{font-size:15px}
.pw .rk-by{font-size:13px;font-weight:600;gap:5px}
.pw .rk-pc.p23 .rk-by,.pw .rk-row .rk-by{font-weight:500;color:var(--text2)}
.rk-by .rk{width:14px;height:14px}
.rk-pc.p1 .rk-by .rk{width:16px;height:16px}
/* rows 4–100: B dividers, indented 54 px */
.rk-lsec{padding:22px 0 8px;border-bottom:1px solid var(--hairline)}
.rk-rows{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.rk-row{display:flex;align-items:center;gap:14px;min-height:76px;padding:8px 16px 8px 8px;position:relative;border-radius:6px;transition:background-color .3s}
.rk-row+.rk-row::before{content:"";position:absolute;left:54px;right:0;top:0;border-top:1px solid var(--hairline)}
.rk-row:hover,.rk-row.rk-hi{background:var(--tile)}
.rk-row:hover::before,.rk-row:hover+.rk-row::before,.rk-row.rk-hi::before,.rk-row.rk-hi+.rk-row::before{display:none}
.rk-place{min-width:34px;display:flex;flex-direction:column;align-items:center;gap:1px;flex:none}
.rk-place b{font-size:17px;font-weight:700;line-height:1.1}
.rk-mv{font-size:11px;font-weight:600;color:var(--text2);letter-spacing:.02em}
.rk-th{width:96px;height:64px;display:flex;align-items:center;justify-content:center;flex:none;background:var(--tile)}
.rk-th img{width:100%;height:100%;object-fit:contain;display:block}
.rk-row .avatar{width:40px;height:40px;margin:0;color:var(--text2)}
.pw .rk-nmw{font-size:15px;font-weight:600}
.rk-nmw .rk{width:18px;height:18px}
.rk-stretch::after{content:"";position:absolute;inset:0;border-radius:6px}
.rk-stretch:focus-visible{outline:0}
.rk-stretch:focus-visible::after{outline:2px solid var(--text);outline-offset:-2px}
.rk-cnt{font-size:13px;color:var(--text2);flex:none;width:90px}
/* photographers 1–3: info left 380 px, four works right */
.rk-ap{display:flex;flex-direction:column;border-bottom:1px solid var(--hairline)}
.rk-acard{display:grid;grid-template-columns:380px minmax(0,1fr);gap:28px;align-items:center;min-width:0;padding:20px 0;border-radius:6px;transition:background-color .3s}
.rk-acard.rk-hi{background:var(--tile)}
.rk-acard+.rk-acard{border-top:1px solid var(--hairline)}
.rk-acard:first-child{padding-top:6px}
.rk-top{display:flex;align-items:center;gap:12px;min-width:0}
.rk-num{font-size:22px;font-weight:700;width:20px;flex:none}
.rk-top .avatar{width:52px;height:52px;font-size:15px;margin:0;color:var(--text2);flex:none}
.rk-mid{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.pw .rk-nm{font-size:17px;font-weight:600;gap:5px}
.rk-nm .rk{width:20px;height:20px}
.rk-sum{font-size:13px;color:var(--text2);font-weight:500}
.rk-sum b{color:var(--text);font-weight:500}
.rk-sum2{font-size:12px;color:var(--text2);font-weight:500}
.rk-follow{height:32px;padding:0 14px;border-radius:999px;border:1px solid var(--chip);background:transparent;font:600 13px var(--font);color:var(--text);flex:none;cursor:pointer;white-space:nowrap}
.rk-follow:hover{border-color:var(--text)}
.rk-q{display:grid;grid-template-columns:repeat(4,1fr);gap:2px}
.rk-qt{display:block;aspect-ratio:1;background:var(--tile);overflow:hidden}
.rk-qt img{width:100%;height:100%;object-fit:cover;display:block}
/* your place: stuck to the bottom of the content, stops above the footer */
.rk-me{position:sticky;bottom:0;z-index:4;margin:24px -28px -56px;min-height:60px;padding:10px 28px;display:flex;align-items:center;gap:12px;background:var(--ground);border-top:1px solid var(--hairline)}
.rk-me .avatar{margin:0;color:var(--text2)}
.rk-met{display:flex;flex-direction:column}
.rk-met b{font-size:15px;font-weight:600}
.rk-mer{margin-left:auto;display:flex;align-items:center;gap:16px;font-size:13px;color:var(--text2)}
.rk-mer b{color:var(--text);font-weight:600}
.rk-go{border:0;background:transparent;padding:4px 0;font:700 13px var(--font);color:var(--text);display:flex;align-items:center;gap:2px;cursor:pointer}
.rk-go .icon{width:16px;height:16px;transform:rotate(-90deg)}
.rk-me-out{justify-content:space-between}
.rk-me-out .btn-quiet{height:34px}
/* ⓘ dialog */
.rk-dlg{width:min(520px,calc(100vw - 32px))}
.rk-dlg .pw-dform{padding:26px 28px 20px}
.rk-dlg h2{font-size:20px;font-weight:800;margin:0 0 4px}
.rk-ip{margin:0;font-size:15px;line-height:1.6;display:flex;gap:8px}
.rk-ip::before{content:"·";color:var(--text2)}
.rk-lrs{display:inline-flex;gap:3px;vertical-align:-3px;white-space:nowrap;align-items:center}
.rk-lrs .n27{font-size:11px;font-weight:800;margin-left:-1px}
/* author page */
.au-prof{display:grid;grid-template-columns:320px minmax(0,1fr);gap:40px;align-items:start}
.au-pf{display:flex;flex-direction:column;gap:14px;position:sticky;top:calc(var(--hdr) + 24px);min-width:0}
.au-av{position:relative;width:96px;height:96px}
.au-av .avatar{width:96px;height:96px;font-size:26px;margin:0;color:var(--text2)}
.au-av .rk{position:absolute;right:-6px;bottom:-6px;width:40px;height:40px;background:var(--ground);border-radius:50%;padding:3px}
.au-nm{display:flex;align-items:center;gap:6px;margin:0;font-size:24px;font-weight:700;line-height:1.2;min-width:0}
.au-nm .nm{min-width:0;overflow:hidden;text-overflow:ellipsis}
.au-url{margin:2px 0 0;font-size:13px;color:var(--text2);min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.au-url span{font-weight:600;color:var(--text)}
.au-nudge{margin:0;border:1px dashed var(--chip);border-radius:8px;padding:10px 12px;font-size:13px;line-height:1.5;color:var(--text2)}
.au-sum{margin:0;font-size:13px;color:var(--text2);line-height:1.5}
.au-sum b{color:var(--text);font-weight:600}
.au-bio{margin:0;font-size:15px;line-height:1.6;white-space:pre-line}
.au-meta{display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--text2)}
.au-meta a,.au-meta span{display:flex;align-items:center;gap:6px;text-decoration:none;min-width:0}
.au-meta a:hover{color:var(--text)}
.au-meta .icon{width:16px;height:16px}
.au-acts{display:flex;gap:8px}
.au-fill{height:40px;padding:0 22px;border-radius:6px;border:1px solid var(--text);background:var(--text);color:var(--ground);font:700 14px var(--font);flex:1;cursor:pointer;white-space:nowrap}
.au-fill.on{background:transparent;color:var(--text);border-color:var(--chip)}
.au-line{height:40px;padding:0 14px;border-radius:6px;border:1px solid var(--chip);background:transparent;color:var(--text);font:600 14px var(--font);display:inline-flex;align-items:center;justify-content:center;gap:6px;cursor:pointer;white-space:nowrap}
.au-line:hover{border-color:var(--text)}
.au-line .icon{width:18px;height:18px}
.au-dots{width:40px;padding:0}
.au-pf .au-acts .au-line.au-share{width:40px;padding:0;flex:none}
.au-acts .au-line:only-child,.au-pf .au-acts:not(:has(.au-fill)) .au-line{flex:1}
.au-mine{margin:0;font-size:12px;color:var(--text2);display:flex;align-items:center;gap:6px}
.au-mine .icon{width:14px;height:14px}
.au-counts{display:flex;border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline)}
.au-counts div{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;padding:12px 0;min-width:0}
.au-counts div+div{border-left:1px solid var(--hairline)}
.au-counts b{font-size:17px;font-weight:700}
.au-counts span{font-size:12px;color:var(--text2);font-weight:500}
.au-grp .label{display:block;margin-bottom:8px}
.au-works{min-width:0}
.au-wh{display:flex;align-items:center;gap:8px;margin-bottom:14px}
.au-wh h2{margin:0;font-size:17px;font-weight:700}
.au-wh .pw-sort{margin-left:auto}
.au-wh .pw-sortbtn{padding:6px 4px 6px 10px}
.au-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:2px}
.au-empty{padding:60px 16px}
.au-blocked{padding-top:96px}
.btn-red{height:40px;padding:0 18px;border:0;border-radius:6px;background:var(--red);color:var(--onred);font:600 15px var(--font);cursor:pointer;white-space:nowrap}
.au-dlg{width:min(480px,calc(100vw - 32px))}
.au-field{display:flex;align-items:center;height:46px;border:1.5px solid var(--text);border-radius:8px;padding:0 14px;font-size:15px;cursor:text}
.au-field .pre{color:var(--text2);flex:none}
.au-field input{flex:1;min-width:0;border:0;outline:0;background:transparent;font:500 15px var(--font);color:var(--text);padding:0}
.au-field:has(input:disabled){border-color:var(--chip);cursor:default}
.au-hstate{margin:0;min-height:18px;font-size:13px;font-weight:600;display:flex;align-items:center;gap:6px}
.au-hstate i{width:7px;height:7px;border-radius:50%;background:var(--text2);display:inline-block;flex:none}
.au-hstate.bad i{background:transparent;box-shadow:inset 0 0 0 1.5px var(--text)}
.au-rules{margin:0;padding-left:18px;font-size:13px;color:var(--text2);line-height:1.6}
@media (max-width:1100px){
  .rk-acard{grid-template-columns:1fr;gap:14px;padding:18px 0}
  .rk-pc.p1 .rk-fit{aspect-ratio:3/2}
  .rk-23{gap:2px}
  .rk-23 .rk-fit{aspect-ratio:1}
  .rk-23 .rk-prow{padding:0 14px}
  .rk-cnt{display:none}
  .rk-me{margin:24px -20px -48px;padding:10px 20px}
  .au-prof{grid-template-columns:1fr;gap:24px}
  .au-pf{position:static}
  .au-grid{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:640px){
  .rk-asof{display:none}
  .rk-asof2{display:block;margin:-14px 0 20px;font-size:12px!important}
  .rk-bar{margin:10px -16px 16px;padding-left:16px}
  .rk-row{gap:12px;padding:8px 0}
  .rk-row+.rk-row::before{left:46px}
  .rk-th{width:84px;height:56px}
  .rk-row .rk,.rk-row .lr{display:none}
  .rk-pp{margin:0 -16px}
  .rk-pp .rk-prow{padding:0 16px}
  .rk-q{margin:0 -16px}
  .rk-me{margin:24px -16px -40px;padding:10px 16px}
  /* the whole bar is the jump button; the arrow goes */
  .rk-go .icon{display:none}
  .rk-go::after{content:"";position:absolute;inset:0}
  .rk-go:focus-visible{outline:0}
  .rk-go:focus-visible::after{outline:2px solid var(--text);outline-offset:-2px}
  .rk-dlg{margin:auto 0 0;width:100%;max-width:100%;border-radius:16px 16px 0 0}
  .rk-dlg .pw-dform{padding:22px 20px calc(18px + env(safe-area-inset-bottom,0px))}
  .au-grid{margin:0 -16px}
  .au-nm{font-size:22px}
  .au-counts b{font-size:15px}
}

/* me — My Page: profile, public and saved photos, notices, blocked (me.go; mock contest-me-v1 mprofile · mgrid · mnotice · mblock) */
.side .sub a .cnt,.dsub a .cnt{margin-left:auto;margin-right:10px;font-size:12px;font-weight:600;color:var(--text2)}
.me .ph{justify-content:flex-start;gap:12px}
.me-gap,.ar-fixgap{height:16px}
.mehead{display:flex;gap:24px;align-items:flex-start;padding-bottom:24px;border-bottom:1px solid var(--hairline)}
.me-av{position:relative;width:96px;height:96px;flex:none}
.me-av .avatar{width:96px;height:96px;margin:0;font-size:28px;color:var(--text2)}
.me-av .medal{position:absolute;right:-4px;bottom:-4px;width:34px;height:34px;border-radius:50%;background:var(--ground);display:flex;align-items:center;justify-content:center}
.me-av .medal .rk{width:24px;height:24px}
.mehead .w{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.me-nm{display:flex;align-items:center;gap:8px;margin:0;font-size:26px;font-weight:800;line-height:1.15;min-width:0}
.me-nm .nm{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.me-nm .lr{width:24px;height:24px}
.me-hd{display:flex;align-items:center;gap:10px;margin:0;font-size:14px;font-weight:500;color:var(--text2);min-width:0}
.me-hd>span:first-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.planpill{height:22px;padding:0 8px;border-radius:999px;border:1px solid var(--chip);font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;display:inline-flex;align-items:center;color:var(--text);flex:none}
.me-prog{display:flex;flex-direction:column;gap:6px;max-width:420px;margin-top:4px}
.me-bar{display:block;width:100%;height:2px}
.me-bar .bg{fill:var(--hairline)}
.me-bar .fg{fill:var(--text)}
.me-prog .caption b{color:var(--text);font-weight:600}
.me-rkl{text-decoration:none}
.me-rkl:hover{text-decoration:underline;text-underline-offset:3px}
.me-bio{margin:4px 0 0;max-width:560px;font-size:15px;line-height:1.6;white-space:pre-line}
.me-facts{display:flex;flex-wrap:wrap;gap:4px 16px;font-size:13px;font-weight:500;color:var(--text2)}
.me-facts a,.me-facts span{display:inline-flex;align-items:center;gap:6px;text-decoration:none;min-width:0}
.me-facts a:hover{color:var(--text)}
.me-facts .icon{width:16px;height:16px}
.me-acts{display:flex;gap:8px;flex:none}
.me-acts .au-line,.me-acts .btn-ink2{height:38px;text-decoration:none;gap:6px}
.me-acts .icon{width:18px;height:18px}
.me-counts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-bottom:1px solid var(--hairline)}
.me-cnt{display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:16px 0;border:0;background:transparent;font:inherit;color:inherit;text-align:left;min-width:0}
.me-cnt+.me-cnt{padding-left:20px;border-left:1px solid var(--hairline)}
button.me-cnt{cursor:pointer}
button.me-cnt:hover b{text-decoration:underline;text-underline-offset:4px}
.me-cnt b{font-size:22px;font-weight:700}
.me-cnt .caption{display:flex;align-items:center;gap:6px}
.me-cnt .caption .icon{width:14px;height:14px}
.me-chipsec{display:grid;grid-template-columns:160px minmax(0,1fr);gap:12px 20px;align-items:center;padding:20px 0;border-bottom:1px solid var(--hairline)}
.me-chips{display:flex;flex-wrap:wrap;gap:8px}
.me-sechd{display:block;margin:30px 0 10px}
.me-list{display:flex;flex-direction:column;border-top:1px solid var(--hairline)}
.me-list .li{display:flex;align-items:center;gap:14px;min-height:56px;padding:8px 4px;border-bottom:1px solid var(--hairline)}
.me-list .li>.icon{width:20px;height:20px;color:var(--text2)}
.me-list .li .t{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.me-list .li .t b{font-size:15px;font-weight:600}
.me-list .au-line{height:36px;flex:none}
.me-fsec{padding:14px 16px 4px;font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text2)}
.me-fdlg .pp-pane .pw-next{padding:12px 0}
.me-kdlg h2{font-size:28px}
.me-kscale{display:block;width:100%;height:14px;margin:10px 0 0}
.me-kscale .pin{fill:var(--text)}
.me-kends{display:flex;justify-content:space-between}
.me-kexp{margin:6px 0 0;font-size:14px;line-height:1.6;color:var(--text2)}
.me-kpriv{margin:0;font-size:13px}
.me-krows{margin:0}
.me-krows div{display:flex;align-items:baseline;gap:8px;min-height:40px;padding:8px 0;border-bottom:1px solid var(--hairline)}
.me-krows div:last-child{border-bottom:0}
.me-krows dt{flex:1;font-size:14px}
.me-krows small{font-size:12px;color:var(--text2)}
.me-krows dd{margin:0;font-size:14px;font-weight:600;white-space:nowrap}
.me-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px}
.me-lead{display:block;margin:8px 0 16px!important}
.me-blist{list-style:none;margin:0;padding:0;max-width:720px;border-top:1px solid var(--hairline)}
.brow{display:flex;align-items:center;gap:14px;padding:12px 4px;border-bottom:1px solid var(--hairline)}
.brow .avatar{width:44px;height:44px;margin:0;flex:none;color:var(--text2)}
.brow .t{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.brow .t b{font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.brow .au-line{flex:none}
.me-toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:60;display:flex;align-items:center;gap:16px;max-width:calc(100vw - 32px);padding:10px 16px;border-radius:8px;background:var(--text);color:var(--ground);font-size:14px;font-weight:600}
.me-toast .u{border:0;background:transparent;color:inherit;opacity:.75;font:600 14px var(--font);text-decoration:underline;text-underline-offset:3px;cursor:pointer;padding:0;white-space:nowrap}
.me-tw{display:grid;align-items:stretch;grid-template-columns:360px minmax(0,1fr);height:min(680px,calc(100vh - var(--hdr) - 150px));min-height:420px;border:1px solid var(--hairline);border-radius:8px;overflow:hidden}
.me-tl{border-right:1px solid var(--hairline);overflow-y:auto;min-height:0}
.me-nlist{list-style:none;margin:0;padding:0}
.me-nrow{display:flex;flex-direction:column;gap:3px;position:relative;padding:14px 16px 14px 22px;border-bottom:1px solid var(--hairline);color:inherit;text-decoration:none}
.me-nrow:hover{background:var(--tile)}
.me-nrow.on{background:var(--tile)}
.me-nrow:focus-visible{outline:2px solid var(--text);outline-offset:-2px}
.me-nrow .dot{position:absolute;left:8px;top:21px;width:6px;height:6px;border-radius:50%;background:var(--red)}
.me-nrow .top{display:flex;align-items:baseline;gap:8px;min-width:0}
.me-nrow .top b{flex:1;min-width:0;font-size:14px;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.me-nrow.unread .top b{font-weight:700}
.me-nrow .when{flex:none;font-size:12px;font-weight:500;color:var(--text2)}
.me-nrow .pv{font-size:13px;line-height:1.45;color:var(--text2);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.me-end{margin:0;padding:18px;text-align:center;font-size:13px;color:var(--text2)}
.me-tl .pw-next{padding:16px 0}
.me-nv{padding:28px 32px;overflow-y:auto;min-width:0;min-height:0}
.me-nv .label{display:block;margin-bottom:8px}
.me-nv h2{margin:0 0 6px;font-size:22px;line-height:1.3;text-wrap:balance}
.me-nbody{margin:16px 0 0;max-width:620px;font-size:15px;line-height:1.75;white-space:pre-line}
.me-back{display:none}
.me-pick,.me-gone{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;min-height:260px;height:100%;text-align:center;color:var(--text2)}
.me-pick .icon,.me-gone .icon{width:32px;height:32px;stroke-width:1.3}
.me-gone p{margin:0;font-size:15px;color:var(--text)}
@media (max-width:1100px){
  .me-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .me-tw{grid-template-columns:300px minmax(0,1fr)}
}
@media (max-width:640px){
  .mehead{flex-direction:column;gap:14px}
  .me-nm{font-size:22px}
  .me-acts{flex-wrap:wrap}
  .me-counts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .me-cnt:nth-child(3){padding-left:0;border-left:0}
  .me-cnt:nth-child(n+3){border-top:1px solid var(--hairline)}
  .me-cnt b{font-size:18px}
  .me-chipsec{grid-template-columns:1fr;gap:8px}
  .me-list .li{flex-wrap:wrap}
  .me-list .li .t{flex-basis:calc(100% - 40px)}
  .me-list .li .au-line{margin-left:34px}
  .me-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:2px;margin:0 -16px}
  .me-tw{grid-template-columns:1fr;height:auto;min-height:0;margin:0 -16px;border:0;border-radius:0}
  .me-tl{border-right:0;overflow:visible}
  .me-tw.sel .me-tl,.me-tw:not(.sel) .me-nv{display:none}
  .me-nv{padding:4px 16px 24px;overflow:visible}
  .me-back{display:inline-flex;align-items:center;gap:6px;margin:0 0 16px;font-size:14px;font-weight:600;color:var(--text2);text-decoration:none}
  .me-back .icon{width:18px;height:18px}
}

/* bell — the header's notifications (notify.go, notify.js; mock contest-me-v1 mbell) */
.bell{position:relative;text-decoration:none}
.bell.open{background:var(--tile)}
.bell .icon{width:22px;height:22px}
.nbadge{position:absolute;left:calc(50% + 2px);top:4px;height:16px;min-width:16px;padding:0 4px;border-radius:999px;background:var(--red);color:var(--onred);font:700 10px/16px var(--font);text-align:center;box-shadow:0 0 0 2px var(--ground);pointer-events:none}
.npanel{position:absolute;right:16px;top:calc(var(--hdr) - 4px);z-index:45;width:min(420px,calc(100vw - 32px));max-height:min(640px,calc(100vh - var(--hdr) - 24px));display:flex;flex-direction:column;overflow:hidden;background:var(--menu);border:1px solid var(--hairline);border-radius:12px}
:root:not([data-theme="dark"]) .npanel,:root:not([data-theme="dark"]) .nbanner{box-shadow:0 12px 32px rgba(0,0,0,.14)}
:root[data-theme="dark"] .npanel,:root[data-theme="dark"] .nbanner{box-shadow:0 12px 32px rgba(0,0,0,.6)}
.npanel .nh{display:flex;align-items:center;gap:12px;padding:16px 18px 10px}
.npanel .nh h2{flex:1;margin:0;font-size:17px;font-weight:700;outline:0}
.nlink{border:0;background:transparent;padding:4px 0;font:600 13px var(--font);color:var(--text2);cursor:pointer;white-space:nowrap}
.nlink:hover{color:var(--text)}
.nlink:disabled{opacity:.45;cursor:default;color:var(--text2)}
.npanel .nlist{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain}
.nstate{display:flex;flex-direction:column;align-items:center;gap:6px;margin:0;padding:32px 24px;text-align:center;font-size:14px;color:var(--text2)}
.nstate b{color:var(--text);font-size:15px}
.nstate .caption{font-size:13px;line-height:1.5}
.nstate>.icon{width:28px;height:28px;color:var(--text2);stroke-width:1.4;margin-bottom:4px}
.npanel .nf{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 18px;border-top:1px solid var(--hairline);font-size:13px;font-weight:600;color:var(--text2)}
.npanel .nf a{text-decoration:none}
.npanel .nf a:hover{color:var(--text)}
.nrow{display:flex;align-items:center;gap:12px;position:relative;padding:12px 18px 12px 22px}
.nrow.un{background:var(--tile)}
.nrow.un::before{content:"";position:absolute;left:9px;top:28px;width:6px;height:6px;border-radius:50%;background:var(--red)}
.nmain{flex:1;min-width:0;display:flex;align-items:flex-start;gap:12px;color:inherit;text-decoration:none}
.nmain:focus-visible{outline:2px solid var(--text);outline-offset:2px;border-radius:4px}
.nrow .lead{position:relative;width:40px;height:40px;flex:none}
.nrow .lead .avatar{width:40px;height:40px;margin:0;color:var(--text2)}
.nrow .lead.two .avatar{position:absolute;width:30px;height:30px;font-size:10px}
.nrow .lead.two .avatar:first-child{left:0;top:0}
.nrow .lead.two .avatar:last-child{right:0;bottom:0;box-shadow:0 0 0 2px var(--menu)}
.nrow.un .lead.two .avatar:last-child{box-shadow:0 0 0 2px var(--tile)}
.nrow .avatar>img.off{object-fit:contain;padding:6px;background:var(--menu)}
.nrow .avatar>img.off.on-dark,:root[data-theme="dark"] .nrow .avatar>img.off.on-light{display:none}
:root[data-theme="dark"] .nrow .avatar>img.off.on-dark{display:block}
.nrow .lead.glyph{display:flex;align-items:center;justify-content:center;border-radius:50%;background:var(--ground);border:1px solid var(--hairline)}
.nrow .lead.glyph .icon{width:20px;height:20px}
.nrow .lead.glyph .rk{width:24px;height:24px}
.nrow .lead.g-heart .icon{fill:var(--red);stroke:var(--red)}
.nrow .t{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px;font-size:14px;line-height:1.45}
.nrow .t .s{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.nrow .t b{font-weight:700}
.nrow .t .q{color:var(--text2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nrow .t .w{font-size:12px;color:var(--text2)}
.nrow:not(.un) .t .s{color:var(--text)}
.nrow .th,.nbanner .th{width:44px;height:44px;flex:none;border-radius:4px;overflow:hidden;background:var(--tile)}
.nrow .th img,.nbanner .th img{display:block;width:100%;height:100%;object-fit:cover}
.nfb{flex:none;height:30px;padding:0 12px;border-radius:999px;border:1px solid var(--text);background:var(--text);color:var(--ground);font:700 12px var(--font);white-space:nowrap;cursor:pointer}
.nfb.on{background:transparent;color:var(--text);border-color:var(--chip)}
.nfb:disabled{opacity:.6}
.nbanner{position:fixed;right:16px;top:calc(var(--hdr) + 8px);z-index:55;width:min(380px,calc(100vw - 32px));display:flex;align-items:center;gap:12px;padding:12px 14px;background:var(--menu);border:1px solid var(--hairline);border-radius:12px;color:var(--text);text-decoration:none;opacity:0;transform:translateY(-12px);transition:opacity .22s ease-out,transform .22s ease-out}
.nbanner.in{opacity:1;transform:none}
.nbanner .t{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;font-size:14px;line-height:1.4}
.nbanner .txt{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.nbanner .q{font-size:13px;color:var(--text2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nbanner .app{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--text2)}
.nbanner .app img{width:16px;height:16px}
.nbanner .on-dark{display:none}
:root[data-theme="dark"] .nbanner .on-light{display:none}
:root[data-theme="dark"] .nbanner .on-dark{display:inline}
.nfull .ph .nlink{font-size:14px;margin-left:auto}
.nfull .nlist{border-top:1px solid var(--hairline);max-width:720px}
.nfull .nrow{border-bottom:1px solid var(--hairline)}
.nfoot{margin:20px 0 0;font-size:14px;font-weight:600}
.nfoot .u{color:var(--text2)}
@media (prefers-reduced-motion:reduce){.nbanner{transform:none;transition:none}}
@media (max-width:640px){
  .nfull .nlist{margin:0 -16px}
  .nrow{padding:12px 16px 12px 22px}
}
/* messages (messages.go, mock contest-me-v1.html #mmsg): two panes, one at a time on a phone */
.ms-tw{display:grid;grid-template-columns:360px minmax(0,1fr);margin-top:16px;border:1px solid var(--hairline);border-radius:8px;height:calc(100vh - var(--hdr) - 140px);min-height:480px;overflow:hidden}
.ms-tl{border-right:1px solid var(--hairline);display:flex;flex-direction:column;min-height:0}
.ms-tabs{display:flex;gap:4px;padding:0 12px;border-bottom:1px solid var(--hairline);flex:none}
.ms-solotabs{margin-top:14px;padding:0}
.ms-tabs a{padding:12px 10px;font-size:14px;font-weight:600;color:var(--text2);position:relative;display:flex;gap:6px;align-items:center;text-decoration:none;white-space:nowrap}
.ms-tabs a:hover,.ms-tabs a.on{color:var(--text)}
.ms-tabs a.on::after{content:"";position:absolute;left:50%;bottom:-1px;width:6px;height:6px;margin-left:-3px;border-radius:50%;background:var(--red)}
.ms-tabs .n{font-size:11px;font-weight:700;color:var(--onred);background:var(--red);border-radius:999px;padding:0 6px;line-height:16px;min-width:16px;text-align:center}
.ms-list{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain}
.ms-row{display:flex;gap:12px;padding:14px 16px;border-bottom:1px solid var(--hairline);position:relative;text-decoration:none;color:inherit}
.ms-row:hover,.ms-row.on{background:var(--tile)}
.ms-row:focus-visible{outline-offset:-2px}
.ms-row .avatar,.ms-who .avatar{width:40px;height:40px;margin:0;flex:none}
.ms-row .t{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.ms-row .top{display:flex;align-items:center;gap:6px;min-width:0;font-size:14px;font-weight:600}
.ms-row .nm{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ms-row .when{margin-left:auto;padding-left:8px;flex:none;font-size:12px;font-weight:500;color:var(--text2)}
.ms-row .pv{font-size:13px;line-height:1.45;color:var(--text2);word-break:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ms-row.unread .pv{color:var(--text);font-weight:600}
.ms-row .pv.hid,.ms-row .pv .me{font-weight:500;color:var(--text2)}
.ms-row.unread .pv.mine{color:var(--text2);font-weight:400} /* my own last line is not news */
.ms-row .dot{position:absolute;left:5px;top:31px;width:6px;height:6px;border-radius:50%;background:var(--red)}
.ms .gone{color:var(--text2)}
.offi{flex:none;font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;line-height:14px;border:1px solid var(--chip);border-radius:4px;padding:0 5px;color:var(--text2)}
.ms-offav{background:var(--ground)}
.ms-offav>img{object-fit:contain;padding:20%}
.ms-offav>img.on-dark,:root[data-theme="dark"] .ms-offav>img.on-light{display:none}
:root[data-theme="dark"] .ms-offav>img.on-dark{display:block}
.ms-lerr{display:flex;flex-direction:column;align-items:flex-start;gap:10px;padding:24px 16px}
.ms-next{display:flex;flex-direction:column;align-items:center;gap:8px;padding:14px}
.ms-tv{display:flex;flex-direction:column;min-width:0;min-height:0}
.ms-vh{display:flex;align-items:center;gap:8px;padding:10px 10px 10px 16px;border-bottom:1px solid var(--hairline);flex:none}
.ms-back{display:none}
.ms-who{flex:1;min-width:0;display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit}
.ms-who .avatar{width:36px;height:36px}
.ms-who .t{display:flex;flex-direction:column;min-width:0}
.ms-who b{display:flex;align-items:center;gap:6px;min-width:0;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
a.ms-who:hover b{text-decoration:underline;text-underline-offset:3px}
.ms-who .caption{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ms-msgs{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;display:flex;flex-direction:column;padding:18px 20px}
.ms-msgs:focus-visible{outline-offset:-2px}
.ms-older{align-self:center;flex:none;height:32px;padding:0 14px;margin-bottom:12px;border:1px solid var(--chip);border-radius:999px;background:transparent;color:var(--text);font:600 13px var(--font);cursor:pointer}
.ms-older:disabled{opacity:.5;cursor:default}
.ms-thread{display:flex;flex-direction:column;gap:10px;margin-top:auto}
.ms-day{align-self:center;margin:6px 0;font-size:12px;font-weight:600;color:var(--text2)}
.ms-m{display:flex;flex-direction:column;align-items:flex-start;gap:4px;max-width:70%}
.ms-m.me{align-self:flex-end;align-items:flex-end}
.ms-m .bub{margin:0;padding:10px 14px;border-radius:14px;background:var(--tile);font-size:14px;line-height:1.5;white-space:pre-wrap;word-break:normal;overflow-wrap:anywhere}
.ms-m.me .bub{background:var(--text);color:var(--ground)}
.ms-m.hid .bub{background:transparent;border:1px dashed var(--chip);color:var(--text2)}
.ms-m.pend .bub{opacity:.55}
.ms-m .bmeta{font-size:11px;color:var(--text2)}
.ms-m .bmeta.fail{color:var(--red);font-weight:700}
.ms-link{border:0;background:none;padding:2px 0;font:inherit;color:inherit;text-decoration:underline;text-underline-offset:2px;cursor:pointer}
.ms-offnote{display:flex;gap:8px;align-items:flex-start;margin:16px 0 0;padding:10px 12px;border:1px solid var(--rule);border-radius:8px;font-size:13px;line-height:1.5;color:var(--text2)}
.ms-offnote .icon{width:16px;height:16px;margin-top:1px}
.ms-compose{display:flex;flex-direction:column;gap:6px;margin:0;padding:12px 16px;border-top:1px solid var(--hairline);flex:none}
.ms-crow{display:flex;gap:10px;align-items:flex-end}
.ms-compose textarea{flex:1;min-width:0;min-height:42px;max-height:132px;resize:none;border:1px solid var(--chip);border-radius:8px;background:transparent;padding:10px 12px;font:14px/1.45 var(--font);color:var(--text);outline:0}
.ms-compose textarea:focus{border-color:var(--text)}
.ms-compose textarea::placeholder,.ms-dlg textarea::placeholder{color:var(--text2)}
.ms-send{gap:6px;height:42px}
.ms-send .icon{width:18px;height:18px}
.ms-hint{display:flex;flex-wrap:wrap;gap:4px 12px;margin:0;font-size:12px;color:var(--text2)}
.ms-keys{margin-left:auto}
.ms-count.over{color:var(--red);font-weight:700}
.ms-closed{margin:0;padding:16px;border-top:1px solid var(--hairline);font-size:14px;color:var(--text2);flex:none}
.ms-pick{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:24px;text-align:center}
.ms-pick .icon{width:40px;height:40px;color:var(--text2);stroke-width:1.3}
.ms-pane{flex:1;justify-content:center}
.ms-chk{display:flex;gap:10px;align-items:center;font-size:14px;font-weight:600;cursor:pointer}
.ms-chk input{width:18px;height:18px;margin:0;accent-color:var(--text)}
.ms-popnote{max-width:280px;padding:8px 12px;line-height:1.5}
.ms-dlg{width:min(520px,calc(100vw - 32px))}
.ms-dlg .ms-to{display:flex;align-items:center;gap:10px;margin:0;padding:0 0 12px;border-bottom:1px solid var(--hairline);font-size:14px;min-width:0}
.ms-dlg .ms-to .label{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text2);min-width:56px}
.ms-dlg .ms-to .avatar{width:24px;height:24px;margin:0;font-size:11px;flex:none}
.ms-dlg .ms-to b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ms-dlg textarea{min-height:150px;resize:vertical;line-height:1.5}
.ms-dlg .ms-count{text-align:right}
.ms-note{display:flex;gap:8px;align-items:flex-start}
.ms-note .icon{width:16px;height:16px;margin-top:1px}
.au-pf .au-acts .au-line.au-msg{width:40px;padding:0;flex:none}
@media (max-width:1100px){.ms-tw{grid-template-columns:300px minmax(0,1fr)}}
@media (max-width:640px){
  .ms-tw{grid-template-columns:1fr;margin:12px -16px 0;border:0;border-radius:0;height:auto;min-height:0;overflow:visible}
  .ms-tl{border-right:0}
  .ms-list{overflow:visible}
  .ms:not(.ms-open) .ms-tv,.ms.ms-open .ms-tl,.ms.ms-open .ms-ph{display:none}
  .ms.ms-open .ms-tw{margin-top:-18px}
  .ms.ms-open .ms-tv{height:calc(100vh - var(--hdr));height:calc(100dvh - var(--hdr))}
  .ms-back{display:inline-flex;margin-left:-8px}
  .ms-vh{padding-left:8px}
  .ms-msgs{padding:14px 16px}
  .ms-m{max-width:85%}
  .ms-keys{display:none}
}
/* contests — list, contest, results, notice, entry dialog (contest.go, mock .impeccable/mocks/desktop-web/contest-me-v1.html clist·cdetail·centry·cresult·crules) */
.ct-sec{margin:26px 0 0}
.ct-sec:first-of-type{margin-top:12px}
.ct-sec>.label{display:block;margin:0 0 12px}
.ct-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 24px}
.ct-grid.ended{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.ct-card{display:flex;flex-direction:column;gap:10px;min-width:0}
.ct-poster{position:relative;display:block;aspect-ratio:16/9;border-radius:12px;overflow:hidden;background:var(--tile);color:#F2F2F2;text-decoration:none}
.ct-poster img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.ct-card.ended .ct-poster{aspect-ratio:16/7}
.ct-card.ended .ct-poster img{filter:grayscale(.7) brightness(.9)}
.ct-card.preview .ct-poster{outline:1.5px dashed var(--chip);outline-offset:3px}
.ct-noposter{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:16px;text-align:center;color:var(--text2);font-size:17px;font-weight:700}
.ct-band{position:absolute;left:12px;top:12px;height:26px;padding:0 10px;border-radius:999px;background:var(--veil);color:#F2F2F2;font-size:12px;font-weight:700;display:inline-flex;align-items:center;gap:6px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.3);white-space:nowrap}
.ct-band.hot{background:var(--red);color:var(--onred);box-shadow:none}
.ct-band .icon{width:14px;height:14px;stroke-width:2}
.ct-t{font-size:18px;font-weight:700;line-height:1.3;margin:0;text-wrap:balance}
.ct-t a{color:inherit;text-decoration:none}
.ct-t a:hover{text-decoration:underline;text-underline-offset:3px}
.ct-card.ended .ct-t{font-size:15px}
.ct-ptag{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.06em;color:var(--text2);border:1px dashed var(--chip);border-radius:4px;padding:2px 6px;vertical-align:2px}
.ct-l{display:flex;gap:6px 14px;flex-wrap:wrap;margin:0;font-size:13px;color:var(--text2);font-weight:500}
.ct-l b{color:var(--text);font-weight:700}
.ct-wins{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.ct-wins a{display:flex;flex-direction:column;gap:4px;min-width:0;text-decoration:none;color:inherit}
.ct-wimg{position:relative;display:block;aspect-ratio:1;border-radius:4px;overflow:hidden;background:var(--tile)}
.ct-wimg img{width:100%;height:100%;object-fit:cover;display:block}
.ct-wlr{position:absolute;left:4px;top:4px;width:22px;height:22px;border-radius:50%;background:rgba(0,0,0,.55);display:flex;align-items:center;justify-content:center}
.ct-wlr .lr{width:18px;height:18px}
.ct-wh{font-size:12px;color:var(--text2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* a contest */
.ct-back{margin-bottom:12px}
.ct-hero{position:relative;aspect-ratio:16/6;border-radius:12px;overflow:hidden;background:var(--tile)}
.ct-like{display:flex;align-items:center;gap:8px;margin:12px 0 4px}
.ct-lk{height:36px;padding:0 14px;border:1px solid var(--chip);border-radius:18px;background:transparent;display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:600;color:var(--text);text-decoration:none;cursor:pointer}
.ct-lk .icon{width:18px;height:18px}
.ct-lk.on .icon{fill:var(--red);stroke:var(--red)}
.ct-like .caption{font-size:13px;color:var(--text2)}
.ct-hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.ct-hero .ov{position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.72),rgba(0,0,0,0) 60%);display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;padding:24px 28px;gap:6px;color:#F2F2F2}
.ct-hero.noposter .ov{background:none;color:var(--text)}
.ct-hero .ov h1{margin:0;font-size:32px;line-height:1.15;font-weight:800;letter-spacing:-.01em;text-wrap:balance}
.pw .ct-hero .ov .label,.pw .ct-hero .ov .caption{color:rgba(242,242,242,.8)}
.pw .ct-hero.noposter .ov .label,.pw .ct-hero.noposter .ov .caption{color:var(--text2)}
.ct-hero .ct-band{position:absolute;left:20px;top:20px}
.ct-body{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:36px;align-items:start;margin-top:26px}
.ct-main>.label{display:block}
.ct-theme{font-size:16px;line-height:1.7;margin:6px 0 0;max-width:640px}
.ct-more1{margin:12px 0 0}
.ct-lnk{font-size:14px;font-weight:700;color:var(--text);display:inline-flex;align-items:center;gap:4px;text-decoration:none}
.ct-lnk:hover{text-decoration:underline;text-underline-offset:3px}
.ct-lnk .icon{width:16px;height:16px;transform:rotate(-90deg);stroke-width:2}
.ct-entries{margin:30px 0 0;padding-top:20px;border-top:1px solid var(--hairline)}
.ct-eh{display:flex;align-items:center;gap:10px;margin:0 0 12px}
.ct-eh h2{margin:0;font-size:17px;font-weight:700}
.ct-sp{flex:1}
.ct-shuffle,.ct-why{border:0;background:transparent;padding:6px 4px;display:inline-flex;align-items:center;gap:6px;font:600 13px var(--font);color:var(--text2);cursor:pointer;border-radius:6px}
.ct-shuffle:hover,.ct-why:hover{color:var(--text)}
.ct-shuffle .icon,.ct-why .icon{width:16px;height:16px}
.ct-egrid{grid-template-columns:repeat(4,1fr);gap:4px}
.ct-tile .ct-mine{position:absolute;left:0;right:0;bottom:0;height:24px;background:rgba(0,0,0,.6);color:#F2F2F2;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;letter-spacing:.04em}
.ct-none{padding:24px 0}
.ct-panel{position:sticky;top:calc(var(--hdr) + 16px);border:1px solid var(--rule);border-radius:8px;padding:18px 18px 16px;display:flex;flex-direction:column;gap:12px}
.ct-panel .r{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-size:14px}
.ct-panel .r time{text-align:right;font-weight:600}
.ct-tz{font-size:12px;color:var(--text2);text-align:right;margin:-6px 0 0}
.ct-panel hr{border:0;border-top:1px solid var(--hairline);margin:2px 0;width:100%}
.ct-btn{height:44px;border:0;border-radius:6px;background:var(--text);color:var(--ground);font:700 15px var(--font);display:flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;text-decoration:none;width:100%}
.ct-btn:disabled{background:var(--tile);color:var(--text2);cursor:default}
.ct-btn .icon{width:18px;height:18px;stroke-width:2}
.ct-state{margin:0;font-size:14px;font-weight:600;text-align:center;padding:12px;border-radius:6px;background:var(--tile)}
.ct-rule{margin:0;font-size:13px;color:var(--text2);text-align:center}
.ct-panel .ct-why{align-self:center}
/* results */
.ct-reslead{display:flex;align-items:center;flex-wrap:wrap;gap:6px 12px;margin:28px 0 14px}
.ct-reslead h2{margin:0;font-size:17px;font-weight:700}
.ct-gonefit{display:flex;align-items:center;justify-content:center;background:var(--tile)}
.ct-gone{color:var(--text2);font-size:13px}
.pw .ct-gonet{color:var(--text2);font-size:13px;font-weight:500}
.ct-city{font-weight:500;color:var(--text2);white-space:nowrap}
/* the notice */
.ct-article{max-width:680px;margin:0 auto}
.ct-article>.label{display:block;font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text2)}
.ct-article>h1{font-size:28px;margin:6px 0 6px;line-height:1.2;text-wrap:balance}
.ct-article>.caption{margin:0;font-size:13px;color:var(--text2)}
.ct-doc{margin-top:18px}
.ct-doc h1{font-size:24px;font-weight:800;margin:28px 0 8px;line-height:1.25}
.ct-doc h2{font-size:18px;font-weight:700;margin:28px 0 8px}
.ct-doc p,.ct-doc li{font-size:16px;line-height:1.75}
.ct-doc p{margin:0 0 12px}
.ct-doc ul,.ct-doc ol{padding-left:22px;margin:0 0 12px}
.ct-doc a{color:var(--text);text-decoration:underline;text-underline-offset:3px}
.ct-fig{margin:14px 0}
.ct-fig img{display:block;width:100%;height:auto;border-radius:8px;background:var(--tile)}
.ct-docback{margin:32px 0 0}
/* the entry dialog: the album picker's frame with the contest's marks */
.ct-picker .al-pklist .ar-tile.ct-full{opacity:.4;cursor:default}
.ct-pub{position:absolute;left:0;right:0;bottom:0;padding:3px 0;background:rgba(0,0,0,.62);color:#F2F2F2;font:700 10px var(--font);text-align:center;pointer-events:none}
.ct-pkbar{flex-wrap:wrap}
.ct-pkbar .btn-quiet{color:var(--text);cursor:pointer}
.ct-pknote{flex:1;min-width:180px}
.ct-pkbar .ar-grow{display:none}
.ct-toast{display:flex;flex-direction:column;gap:2px}
.pw-toast.ct-toast .caption{color:inherit;opacity:.75;font-weight:500}
/* the photo page's contest line and the upload band */
.pd-ct{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid var(--rule);border-radius:8px;text-decoration:none;color:var(--text)}
.pd-ct:hover{border-color:var(--text)}
.pd-ct>.icon{width:20px;height:20px}
.pd-ct>.icon:last-child{width:16px;height:16px;color:var(--text2);margin-left:auto}
.pd-ct .t{display:flex;flex-direction:column;gap:2px;min-width:0}
.pd-ct b{font-size:15px;font-weight:600}
.pd-ct .caption{display:flex;align-items:center;gap:4px}
.pd-ct .lr{width:18px;height:18px}
.ct-ubanner{display:flex;align-items:center;gap:14px;border:1px solid var(--rule);border-radius:8px;padding:10px 14px 10px 10px;margin:0 0 18px}
.ct-ubanner img{width:72px;height:40px;border-radius:4px;object-fit:cover;flex:none;background:var(--tile)}
.ct-ubanner div{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.ct-ubanner b{font-size:15px}
.ct-ubanner .caption{font-size:13px;color:var(--text2)}
@media (max-width:1100px){
  .ct-body{grid-template-columns:1fr;gap:20px}
  .ct-panel{position:static;order:-1}
  .ct-grid.ended{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){
  .ct-grid,.ct-grid.ended{grid-template-columns:1fr}
  .ct-hero{aspect-ratio:16/9}
  .ct-hero .ov{padding:16px}
  .ct-hero .ov h1{font-size:24px}
  .ct-egrid{grid-template-columns:repeat(3,1fr);gap:2px}
  .ct-ubanner{flex-wrap:wrap}
  .ct-ubanner img{display:none}
}
/* settings — My Page › Settings, Edit profile, Delete account (settings.go;
   mock contest-me-v1 mset, medit, mdel) */
.st .caption{font-size:13px;font-weight:500;line-height:1.45;color:var(--text2);margin:0}
.st-set{max-width:760px;margin-top:22px}
.st-grp{margin:0 0 30px}
.st-lab{display:block;margin:0 0 6px;font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text2)}
.st-lead{display:block;margin:-2px 0 10px!important}
.st-sub{margin:18px 0 0;padding:0 0 6px;font-size:13px;font-weight:700;color:var(--text)}
.st-row{display:flex;align-items:center;gap:16px;min-height:58px;padding:10px 0;border-bottom:1px solid var(--hairline)}
.st-grp>.st-row:first-of-type,.st-grp form>.st-row:first-of-type,.st-sub+.st-row{border-top:1px solid var(--hairline)}
.st-row .t{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.st-row .t b{font-size:15px;font-weight:600}
.st-row .t label{cursor:pointer}
.st-rowhead{border-bottom:0;min-height:0;padding-bottom:2px}
.st-foot{margin-top:10px!important}
.st-sw{position:relative;display:inline-flex;flex:none;cursor:pointer}
.st-sw input{position:absolute;opacity:0;width:1px;height:1px}
.st-sw .track{width:42px;height:24px;border-radius:999px;background:var(--chip);position:relative}
.st-sw .track::after{content:"";position:absolute;left:3px;top:3px;width:18px;height:18px;border-radius:50%;background:var(--ground);transition:left .15s}
.st-sw input:checked+.track{background:var(--text)}
.st-sw input:checked+.track::after{left:21px}
.st-sw input:focus-visible+.track{outline:2px solid var(--text);outline-offset:2px}
.st-sw input:disabled+.track{opacity:.5}
.st-seg{display:inline-flex;flex-wrap:wrap;border:1px solid var(--chip);border-radius:6px;overflow:hidden;flex:none;margin:0;padding:0;min-width:0}
.st-seg label{cursor:pointer;position:relative}
.st-seg input{position:absolute;opacity:0;width:1px;height:1px}
.st-seg span{display:block;padding:7px 12px;font-size:13px;font-weight:600;color:var(--text2)}
.st-seg input:checked+span{background:var(--text);color:var(--ground)}
.st-seg input:focus-visible+span{outline:2px solid var(--text);outline-offset:-2px}
.st-selw{position:relative;display:inline-flex;flex:none}
.st-selw select{appearance:none;-webkit-appearance:none;height:42px;min-width:180px;width:100%;border:1px solid var(--chip);border-radius:6px;background:transparent;color:var(--text);font:400 15px var(--font);padding:0 34px 0 12px;cursor:pointer}
.st-selw select:disabled{opacity:.5;cursor:default}
.st-selw::after{content:"";position:absolute;right:14px;top:50%;width:7px;height:7px;margin-top:-6px;border-right:1.6px solid var(--text2);border-bottom:1.6px solid var(--text2);transform:rotate(45deg);pointer-events:none}
.st-apply{margin-top:12px}
.st-tones{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;padding:12px 0 14px;border-bottom:1px solid var(--hairline)}
.st-tones label{cursor:pointer;position:relative;min-width:0}
.st-tones input{position:absolute;opacity:0;width:1px;height:1px}
.st-tones label>span{height:100%;border:1px solid var(--chip);border-radius:8px;padding:10px 12px;display:flex;flex-direction:column;gap:4px}
.st-tones b{font-size:14px}
.st-tones .caption{font-size:12px;line-height:1.4}
.st-tones input:checked+span{border-color:var(--text);box-shadow:inset 0 0 0 1px var(--text)}
.st-tones input:focus-visible+span{outline:2px solid var(--text);outline-offset:2px}
.st-quiet{display:flex;align-items:flex-end;gap:12px;padding:12px 0 14px;border-bottom:1px solid var(--hairline)}
.st-quiet label{display:flex;flex-direction:column;gap:4px;font-size:12px;font-weight:600;color:var(--text2)}
.st-quiet input{height:42px;border:1px solid var(--chip);border-radius:6px;background:transparent;color:var(--text);font:400 15px var(--font);padding:0 10px}
.st-quiet>span{padding-bottom:10px;color:var(--text2)}
.st-list{display:flex;flex-direction:column;border-top:1px solid var(--hairline)}
.st-list form{margin:0}
.st-list .li{display:flex;align-items:center;gap:14px;width:100%;min-height:56px;padding:8px 4px;border:0;border-bottom:1px solid var(--hairline);background:transparent;color:var(--text);text-align:left;text-decoration:none;font:inherit;cursor:pointer}
.st-list div.li{cursor:default}
.st-list .li>.icon{width:20px;height:20px;color:var(--text2)}
.st-list .li>.icon:last-child{width:16px;height:16px;stroke-width:2}
.st-list .li .t{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.st-list .li .t b{font-size:15px;font-weight:600}
.st-list .li.danger b{color:var(--red)}
.st-list a.li:hover,.st-list button.li:hover{background:var(--tile)}
.st-empty{display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;padding:96px 16px}
.st-empty>.icon{width:40px;height:40px;color:var(--text2);stroke-width:1.3}
.st-empty b{font-size:17px;font-weight:700}
/* edit profile */
.st-form{display:grid;grid-template-columns:200px minmax(0,1fr);gap:22px 32px;max-width:860px;margin-top:22px;padding-bottom:24px}
.st-lab2{font-size:14px;font-weight:700;padding-top:10px}
.st-lab2 .caption{display:block;font-weight:500;margin-top:2px}
.st-fld{min-width:0;display:flex;flex-direction:column;gap:8px}
.st-inp{display:flex;align-items:center;gap:8px;min-height:42px;border:1px solid var(--chip);border-radius:6px;padding:0 12px}
.st-inp:focus-within{border-color:var(--text)}
.st-inp input,.st-inp textarea{flex:1;min-width:0;border:0;background:transparent;color:var(--text);font:400 15px/1.5 var(--font);padding:9px 0;outline:0}
.st-inp input::placeholder,.st-inp textarea::placeholder{color:var(--text2)}
.st-inp .pre{color:var(--text2);font-size:15px;white-space:nowrap}
.st-ta{align-items:flex-start}
.st-ta textarea{resize:vertical;min-height:88px}
.st-cnt{flex:none;font-size:12px;font-weight:600;color:var(--text2);padding-top:2px}
.st-ta .st-cnt{align-self:flex-end;padding-bottom:9px}
.st-two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.st-two .st-selw select{min-width:0}
.st-fld>.st-selw{max-width:360px}
.st-fld .hint{margin-top:0}
.st-fld .hint:empty{display:none}
.st-picks{margin-top:0}
.st-picks input:checked+span{background:var(--text);color:var(--ground);border-color:var(--text)}
.st-picks input:checked+span::before{content:none}
.st-extra{max-width:360px}
.st-av{display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px}
.st-bigav{width:72px;height:72px;margin:0;font-size:22px;color:var(--text2)}
.st-avb{display:flex;gap:8px;flex-wrap:wrap}
.st-avb .btn-quiet{background:transparent;cursor:pointer}
.st-file{position:relative}
.st-file input{position:absolute;opacity:0;width:1px;height:1px}
.st-file:focus-within{outline:2px solid var(--text);outline-offset:2px}
.st-avnote{flex-basis:100%}
.st-avnote.bad{color:var(--text)}
.st-avnote.bad::before{content:"! ";font-weight:700}
.st-savebar{position:sticky;bottom:0;z-index:5;display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin:0 -28px -56px;padding:14px 28px calc(14px + env(safe-area-inset-bottom,0px));background:var(--ground);border-top:1px solid var(--hairline)}
.st-savebar .sp{flex:1}
.st-savebar .btn-quiet{background:transparent}
.st-err{font-size:13px;color:var(--text)}
.st-err:empty{display:none}
.st-cropdlg{width:min(620px,calc(100vw - 32px))}
.st-crop{display:flex;gap:24px;align-items:center}
.st-croparea{position:relative;width:min(320px,70vw);aspect-ratio:1;flex:none;cursor:grab;touch-action:none;background:#000}
.st-croparea:active{cursor:grabbing}
.st-croparea canvas{display:block;width:100%;height:100%}
.st-croparea::after{content:"";position:absolute;inset:0;border-radius:0;background:radial-gradient(circle at center,transparent 0 69.5%,rgba(0,0,0,.6) 70%);pointer-events:none}
.st-cropside{display:flex;flex-direction:column;gap:14px;min-width:0}
.st-zoom{display:flex;align-items:center;gap:8px}
.st-zoom .icon{width:16px;height:16px;color:var(--text2)}
.st-zoom .icon:last-child{width:22px;height:22px}
.st-zoom input{flex:1;min-width:120px;accent-color:var(--text)}
/* delete account */
.st-del{max-width:620px}
.st-dlead{font-size:15px;line-height:1.7;margin:16px 0 0}
.st-dlist{margin:10px 0 18px;padding-left:20px;font-size:15px;line-height:1.8}
.st-delform{display:flex;flex-direction:column;align-items:flex-start;gap:10px}
.st-delform .st-inp{width:min(360px,100%)}
.st-delform .st-lab2{padding-top:8px}
.st-chk{display:flex;align-items:center;gap:10px;font-size:15px;font-weight:600;cursor:pointer;margin-bottom:8px}
.st-chk input{width:20px;height:20px;margin:0;accent-color:var(--text)}
.st-eye{border:0;background:transparent;color:var(--text2);padding:4px;cursor:pointer;display:flex}
.st-eye .icon{width:20px;height:20px}
.st-delbtn{margin-top:8px;touch-action:auto}
.st-gwrap{min-height:44px;transition:opacity .15s}
.st-gwrap.off{opacity:.4;pointer-events:none}
.st-gbtn{width:360px;max-width:100%}
.st-note{display:flex;gap:10px;padding:12px 14px;border-radius:8px;background:var(--tile);font-size:14px;line-height:1.55;margin-top:14px}
.st-note .icon{width:18px;height:18px;color:var(--text2);margin-top:1px}
.st-back{margin:24px 0 0}
.st-done{max-width:560px;padding:72px 0 96px}
.st-done p{margin:12px 0 24px;color:var(--text2);line-height:1.6}
@media (max-width:1100px){
  .st-tones{grid-template-columns:repeat(3,minmax(0,1fr))}
  .st-savebar{margin:0 -20px -48px;padding-left:20px;padding-right:20px}
}
@media (max-width:640px){
  .st-row.st-wrap{flex-wrap:wrap}
  .st-row.st-wrap .st-seg{width:100%}
  .st-row.st-wrap .st-seg label{flex:1}
  .st-row.st-wrap .st-seg span{text-align:center}
  .st-tones{grid-template-columns:1fr 1fr}
  .st-selw select{min-width:140px}
  .st-form{grid-template-columns:1fr;gap:8px}
  .st-lab2{padding-top:14px}
  .st-savebar{margin:0 -16px -40px;padding:12px 16px calc(12px + env(safe-area-inset-bottom,0px))}
  .st-crop{flex-direction:column;align-items:stretch}
  .st-croparea{width:100%}
  .st-quiet{flex-wrap:wrap}
}
@media (prefers-reduced-motion:reduce){.st-sw .track::after,.st-gwrap{transition:none}}
/* small text buttons: a target of at least 32px (40px on a phone) */
.nlink,.ms-link,.ct-shuffle,.ct-why{min-height:32px;padding:6px 8px}
@media (max-width:640px){
  .nlink,.ms-link,.ct-shuffle,.ct-why{min-height:40px}
}
/* Japanese and Chinese previews break as those languages do (body keep-all is for Korean), never mid-word */
:lang(ja) .ms-row .pv,:lang(ja) .me-nrow .pv,:lang(ja) .nrow .t .s,:lang(ja) .nrow .t .q,:lang(ja) .nbanner .txt,:lang(ja) .nbanner .q,
:lang(zh) .ms-row .pv,:lang(zh) .me-nrow .pv,:lang(zh) .nrow .t .s,:lang(zh) .nrow .t .q,:lang(zh) .nbanner .txt,:lang(zh) .nbanner .q{word-break:normal;line-break:strict}
/* cookies: consent banner and Cookie settings (analytics.go, mock .impeccable/mocks/web-analytics/layout-v1.html) */
.links .ck-open{border:0;background:transparent;padding:0;font:inherit;color:var(--text2);cursor:pointer}
.links .ck-open:hover{text-decoration:underline;text-underline-offset:4px}
.ckbar{position:fixed;left:16px;right:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:45;margin:0 auto;max-width:760px;background:var(--menu);color:var(--text);border:1px solid var(--rule);border-radius:10px;box-shadow:0 8px 28px rgba(0,0,0,.18);padding:16px 18px;display:flex;gap:18px;align-items:center}
.ckbar p{margin:0;font-size:14px;line-height:1.5;flex:1}
.ckbar p a{color:inherit;text-underline-offset:3px}
.ckbar .acts{display:flex;gap:8px;flex:none;margin:0}
.ckbar .btn-quiet{background:transparent;cursor:pointer;color:var(--text)}
/* --ckh: the banner's height from the bottom edge (app.js measures it). The
   page's own bottom bars and toasts sit above it until a choice is made. */
body:has(.ckbar){padding-bottom:var(--ckh,120px)}
body:has(.ckbar) .ubar,body:has(.ckbar) .ar-bar,body:has(.ckbar) .rk-me{bottom:var(--ckh,120px)}
body:has(.ckbar) .pw-toast,body:has(.ckbar) .ar-toast{bottom:calc(var(--ckh,120px) + 8px)}
.ck-dlg .ck-opts{margin-top:14px}
.ck-opt{display:flex;gap:14px;align-items:flex-start;padding:12px 0;border-top:1px solid var(--hairline);cursor:pointer}
.ck-opt:last-child{border-bottom:1px solid var(--hairline)}
.ck-opt span{flex:1;min-width:0}
.ck-opt b{display:block;font-size:14px}
.ck-opt small{display:block;font-size:13px;color:var(--text2);margin-top:2px;line-height:1.45}
.ck-sw{appearance:none;-webkit-appearance:none;width:42px;height:24px;border-radius:999px;background:var(--chip);position:relative;flex:none;margin:2px 0 0;cursor:pointer;transition:background .15s}
.ck-sw::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;transition:left .15s}
.ck-sw:checked{background:var(--text)}
.ck-sw:checked::after{left:21px;background:var(--ground)}
.ck-sw:disabled{opacity:.45;cursor:default}
.ck-opt:has(.ck-sw:disabled){cursor:default}
@media (max-width:640px){
  .ckbar{left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom,0px));flex-direction:column;align-items:stretch;gap:12px;padding:14px}
  .ckbar .acts .btn-quiet,.ckbar .acts .btn-ink2{flex:1;justify-content:center}
}
@media (prefers-reduced-motion:reduce){.ck-sw,.ck-sw::after{transition:none}}
html:not(.js) .links .ck-open{display:none} /* without JS GA never runs, so there is nothing to turn off */

/* ---- ad landing /app/start (start.go, mock landing-v2): no menu, one CTA ---- */
.lp .lp-wrap{width:100%;max-width:1180px;margin:0 auto;padding-left:max(24px,env(safe-area-inset-left,0px));padding-right:max(24px,env(safe-area-inset-right,0px))}
.lp main{flex:1}
.lp-top{display:flex;align-items:center;gap:16px;padding-block:18px}
.lp-top .sp,.lp-foot .sp{flex:1}
.lp-logo{display:flex;align-items:center;text-decoration:none}
.lp-logo img{display:none;height:30px;width:auto}
.lp-logo .lk.on-light{display:block}
:root[data-theme="dark"] .lp-logo .lk.on-light{display:none}
:root[data-theme="dark"] .lp-logo .lk.on-dark{display:block}
.lp-have{margin:0;font-size:13px;color:var(--text2)}
.lp-have a{font-weight:600;color:var(--text);margin-left:4px}
.lp-eyebrow{margin:0 0 14px;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--text2);display:flex;align-items:center;gap:8px}
.lp-eyebrow::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--red)}
.lp-hero{display:grid;grid-template-columns:1fr 1.05fr;gap:56px;align-items:center;padding-block:40px 64px}
.lp-txt{min-width:0}
.lp h1{margin:0 0 18px;font-size:52px;line-height:1.08;font-weight:800;letter-spacing:-.03em;text-wrap:balance}
.lp-lead{margin:0 0 28px;font-size:17px;line-height:1.55;color:var(--text2);max-width:30em}
.lp-cta{display:inline-flex;align-items:center;gap:10px;background:var(--red);color:var(--onred);text-decoration:none;font-weight:700;font-size:16px;padding:16px 26px;border-radius:999px}
.lp-cta .icon{width:18px;height:18px;stroke-width:2.2}
.lp-cta:hover{filter:brightness(1.06)}
.lp-cta:focus-visible{outline:2px solid var(--text);outline-offset:3px}
.lp-note{margin:12px 0 0;font-size:13px;color:var(--text2)}
.lp-pick{position:relative;min-width:0}
.lp-mosaic{display:grid;grid-template-columns:1.25fr 1fr 1fr;grid-template-rows:200px 200px;gap:3px}
.lp-mosaic.n3,.lp-mosaic.n4{grid-template-columns:1.25fr 1fr}
.lp-mosaic .t{overflow:hidden;background:var(--tile);min-width:0}
.lp-mosaic .t:first-child{grid-row:span 2}
.lp-mosaic.n4 .t:nth-child(4){display:none}
.lp-mosaic img{width:100%;height:100%;object-fit:cover;display:block;-webkit-user-drag:none;user-select:none}
.lp-tag{position:absolute;left:12px;top:12px;font-size:11px;font-weight:700;letter-spacing:.06em;padding:6px 10px;border-radius:999px;background:rgba(0,0,0,.6);color:#fff;display:flex;align-items:center;gap:6px}
.lp-tag::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--red)}
.lp-pillars{padding-block:56px;border-top:1px solid var(--hairline);display:grid;grid-template-columns:repeat(3,1fr);gap:40px}
.lp-pillars article{min-width:0}
.lp-pillars .k{margin:0 0 10px;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--red)}
.lp-pillars h2{margin:0 0 10px;font-size:24px;line-height:1.2;font-weight:800;letter-spacing:-.02em;text-wrap:balance}
.lp-pillars p{margin:0;color:var(--text2);line-height:1.55}
.lp-now{padding-block:56px;border-top:1px solid var(--hairline);display:grid;grid-template-columns:1fr 1.05fr;gap:56px;align-items:center}
.lp-now>div{min-width:0}
.lp-now h2{margin:0 0 12px;font-size:30px;line-height:1.15;font-weight:800;letter-spacing:-.02em;text-wrap:balance}
.lp-now p{margin:0 0 20px;color:var(--text2);max-width:30em;line-height:1.55}
.lp-now .lp-lr{margin:16px 0 0;font-size:14px}
.lp-now .lp-lr b{color:var(--text)}
.lp-up{background:var(--menu);border:1px solid var(--hairline);border-radius:14px;padding:18px;box-shadow:0 18px 48px rgba(0,0,0,.08)}
.lp-drop{border:1.5px dashed var(--rule);border-radius:10px;padding:16px;display:flex;align-items:center;gap:12px;font-size:13px;color:var(--text2)}
.lp-drop b{color:var(--text);font-weight:700}
.lp-drop .icon{width:22px;height:22px;flex:none;color:var(--text)}
.lp-thumbs{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin-top:12px}
.lp-thumbs .th{position:relative;aspect-ratio:1;overflow:hidden;border-radius:4px;background:var(--tile)}
.lp-thumbs img{width:100%;height:100%;object-fit:cover;display:block}
.lp-thumbs .wait img{opacity:.55}
.lp-thumbs .ok{position:absolute;right:6px;top:6px;width:18px;height:18px;border-radius:50%;background:rgba(0,0,0,.55);display:grid;place-items:center}
.lp-thumbs .ok svg{width:11px;height:11px;stroke:#fff;fill:none;stroke-width:3}
.lp-thumbs .bar{position:absolute;left:6px;right:6px;bottom:6px;height:3px;border-radius:2px;background:rgba(255,255,255,.45)}
.lp-thumbs .bar i{display:block;height:100%;width:60%;border-radius:2px;background:#fff}
.lp-thumbs .bar i.p4{width:25%}
.lp-apps{padding-block:28px;border-top:1px solid var(--hairline);display:flex;gap:12px 24px;align-items:center;flex-wrap:wrap;font-size:14px;color:var(--text2)}
.lp-apps a{display:inline-flex;align-items:center;gap:8px;text-decoration:none;font-weight:600;color:var(--text);border:1px solid var(--rule);border-radius:999px;padding:7px 14px;font-size:13px}
.lp-apps a small{font-weight:600;color:var(--text2);font-size:12px}
.lp-end{padding-block:56px 64px;border-top:1px solid var(--hairline);display:flex;align-items:center;gap:24px;flex-wrap:wrap}
.lp-end h2{margin:0;font-size:30px;font-weight:800;letter-spacing:-.02em;flex:1;min-width:240px;text-wrap:balance}
.lp-foot{padding-block:20px 28px;border-top:1px solid var(--hairline);display:flex;gap:18px;flex-wrap:wrap;align-items:center;font-size:12px;color:var(--text2)}
.lp-foot a{color:var(--text2);text-decoration:none}
.lp-foot a:hover{text-decoration:underline;text-underline-offset:4px}
.lp-foot .ck-open{border:0;background:transparent;padding:0;font:inherit;color:var(--text2);cursor:pointer}
html:not(.js) .lp-foot .ck-open{display:none}
@media (max-width:1000px){
  .lp-hero,.lp-now{grid-template-columns:1fr;gap:36px}
  .lp-hero{padding-block:20px 48px}
  .lp h1{font-size:40px}
  .lp-pillars{grid-template-columns:1fr;gap:28px}
  .lp-mosaic{grid-template-rows:170px 170px}
}
@media (max-width:520px){
  .lp .lp-wrap{padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
  .lp h1{font-size:32px}
  .lp-have span{display:none}
  .lp-mosaic,.lp-mosaic.n3,.lp-mosaic.n4{grid-template-columns:1fr 1fr;grid-template-rows:none;grid-auto-rows:150px}
  .lp-mosaic .t:first-child{grid-row:span 1;grid-column:span 2}
  .lp-mosaic .t:nth-child(n+4){display:none}
  .lp-thumbs{grid-template-columns:repeat(3,1fr)}
  .lp-thumbs .th:nth-child(n+4){display:none}
  .lp-cta{width:100%;justify-content:center}
  .lp-now h2,.lp-end h2{font-size:24px}
}

/* usearch: the header search and /app/search (usearch.go, usearch.js; mock search-contact-v1 S1–S4) */
.us-sw{position:relative;width:min(380px,100%);display:flex;flex-direction:column;transition:width .15s}
.us-bar{display:flex;align-items:center;gap:10px;min-width:0}
.us-field{flex:1;width:100%;min-width:0;cursor:text}
.us-field input{color:var(--text);height:100%}
.us-field input::-webkit-search-cancel-button{display:none}
.hdr.us-on .us-sw{width:min(560px,100%)}
.hdr.us-on .us-field{border:1.5px solid var(--text);padding:0 13px;color:var(--text)}
.us-chips{display:flex;align-items:center;gap:4px;flex:none;max-width:62%;overflow:hidden}
.us-chips:empty{display:none}
.us-tchip{height:24px;border-radius:999px;background:var(--text);color:var(--ground);font-size:13px;font-weight:700;display:inline-flex;align-items:center;gap:2px;padding:0 3px 0 10px;flex:none;white-space:nowrap;border:0;text-decoration:none;max-width:160px}
.us-tchip .tx{overflow:hidden;text-overflow:ellipsis}
.us-tchip button{border:0;background:transparent;color:inherit;width:20px;height:20px;padding:0;display:flex;align-items:center;justify-content:center;border-radius:50%;cursor:pointer}
.us-tchip .icon{width:12px;height:12px;stroke-width:2.4}
.us-clr{border:0;background:transparent;color:var(--text2);width:24px;height:24px;padding:0;display:flex;align-items:center;justify-content:center;cursor:pointer;flex:none;border-radius:50%}
.us-clr .icon{width:16px;height:16px}
.us-kbd,.us-k{font:700 11px/16px var(--font);color:var(--text2);border:1px solid var(--chip);border-radius:4px;padding:0 5px;white-space:nowrap;flex:none}
.hdr.us-on .us-kbd,.us-field.has .us-kbd{display:none}
.us-cancel{display:none;border:0;background:transparent;font:600 15px var(--font);color:var(--text);cursor:pointer;padding:0 2px;flex:none}
.us-drop{position:absolute;top:44px;left:0;right:0;z-index:20;background:var(--menu);border:1px solid var(--hairline);border-radius:12px;padding:6px;display:flex;flex-direction:column;color:var(--text);max-height:calc(100vh - var(--hdr) - 24px);overflow-y:auto;overscroll-behavior:contain}
:root:not([data-theme="dark"]) .us-drop{box-shadow:0 12px 32px rgba(0,0,0,.12)}
:root[data-theme="dark"] .us-drop{box-shadow:0 12px 32px rgba(0,0,0,.6)}
.us-dh{display:flex;align-items:center;justify-content:space-between;padding:10px 10px 6px}
.us-lb,.us-grp{display:flex;flex-direction:column}
.us-grp+.us-grp>.us-dh,.us-lb+.us-dh,.us-chiprow+.us-dh{margin-top:4px}
.us-label{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text2)}
.us-dh button{border:0;background:transparent;padding:0;font:600 12px var(--font);color:var(--text2);cursor:pointer}
.us-dh button:hover{color:var(--text)}
.us-row{display:flex;align-items:center;gap:12px;min-height:44px;padding:5px 10px;border-radius:8px;font-size:15px;color:var(--text);text-decoration:none;cursor:pointer;min-width:0}
.us-row:hover,.us-row.on{background:var(--tile)}
:root[data-theme="dark"] .us-row:hover,:root[data-theme="dark"] .us-row.on{background:var(--rule)} /* --tile is darker than the dark panel */
.us-row .us-go{flex:1;min-width:0;display:flex;align-items:center;gap:12px;color:inherit;text-decoration:none}
.us-gl{width:32px;height:32px;border-radius:50%;border:1px solid var(--chip);display:flex;align-items:center;justify-content:center;flex:none;color:var(--text2);font-weight:700;font-size:15px}
.us-gl.ink{color:var(--text)}
.us-gl .icon{width:16px;height:16px}
.us-row .avatar{width:32px;height:32px;margin:0;font-size:11px;flex:none;color:var(--text2)}
.us-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.us-t .a{display:flex;align-items:center;gap:5px;min-width:0;font-weight:500}
.us-t .a>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.us-t .a b{font-weight:700}
.us-t .s{font-size:12px;color:var(--text2);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.us-t .s b{color:var(--text);font-weight:600}
.us-t .rk{width:16px;height:16px}
.us-x{width:28px;height:28px;display:flex;align-items:center;justify-content:center;color:var(--text2);flex:none;border-radius:6px;border:0;background:transparent;cursor:pointer;padding:0}
.us-x:hover{color:var(--text);background:var(--hairline)}
.us-x .icon{width:16px;height:16px}
.us-n{color:var(--text2);font-size:13px;flex:none}
.us-chiprow{display:flex;flex-wrap:wrap;gap:8px}
.us-drop .us-chiprow{padding:2px 10px 10px}
.us-chip{height:34px;border:1px solid var(--chip);border-radius:999px;padding:0 14px;display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:500;color:var(--text);text-decoration:none;white-space:nowrap;background:transparent;cursor:pointer}
.us-chip:hover,.us-chip.on{border-color:var(--text)}
.us-chip .n{color:var(--text2);font-size:12px}
.us-note{padding:6px 10px 8px;font-size:12px;line-height:1.5;color:var(--text2);margin:0}
.us-foot{display:flex;flex-wrap:wrap;gap:6px 16px;padding:9px 10px 5px;border-top:1px solid var(--hairline);margin-top:6px;font-size:12px;color:var(--text2);align-items:center}
.us-foot span{display:inline-flex;align-items:center;gap:4px}
.us-foot .r{margin-left:auto}
html.us-lock,html.us-lock body{overflow:hidden}
/* results page */
.us .caption{font-size:13px;font-weight:500;letter-spacing:.02em;line-height:1.4;color:var(--text2);margin:0}
.us-mpill{display:none}
.us-homehint{margin:6px 0 26px!important}
.us-sech{margin-bottom:10px}
.us-h1{font-size:28px;font-weight:700;line-height:1.2;margin:0;letter-spacing:-.01em;display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.us-h1 .us-tchip{height:30px;font-size:15px;padding:0 6px 0 12px;gap:4px;max-width:none}
.us-h1 .us-tchip .icon{width:14px;height:14px}
.us-tabs a .c{font-size:13px;font-weight:500;color:var(--text2);margin-left:2px}
.us-tabs{margin-bottom:20px}
.us-jump{display:flex;align-items:center;gap:12px;min-height:64px;padding:8px 4px;border-bottom:1px solid var(--hairline);margin:-8px 0 8px;color:var(--text);text-decoration:none}
.us-jump:hover{background:var(--tile)}
.us-jump .gl{width:44px;height:44px;border-radius:50%;border:1px solid var(--chip);display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:600;flex:none}
.us-jump .t{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.us-jump b{font-size:15px;font-weight:600}
.us-jump>.icon{width:18px;height:18px;transform:rotate(-90deg);color:var(--text2)}
.us-bar2{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px;margin-bottom:6px;flex-wrap:wrap}
.us-sort{position:relative;flex:none;margin-left:auto}
.us-sort>summary{list-style:none}
.us-sort>summary::-webkit-details-marker{display:none}
.us-sortbtn{display:flex;align-items:center;gap:4px;font-size:13px;font-weight:600;color:var(--text);cursor:pointer;padding:6px 0 6px 6px}
.us-sortbtn .icon{width:16px;height:16px;stroke-width:2}
.us-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:2px}
.us-grid>a:hover{outline:2px solid var(--text);outline-offset:-2px}
.us-grid .ar-tile:hover{outline:2px solid var(--text);outline-offset:-2px}
.us-authors{border-top:1px solid var(--hairline)}
.us-au{display:flex;align-items:center;gap:14px;min-height:72px;padding:10px 12px;border-bottom:1px solid var(--hairline);color:var(--text);text-decoration:none}
a.us-au:hover{background:var(--tile)}
.us-au .avatar{width:44px;height:44px;margin:0;font-size:13px;flex:none;color:var(--text2)}
.us-au .t{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.us-au .nmr{display:flex;align-items:center;gap:5px;font-size:15px;font-weight:500;min-width:0}
.us-au .nm{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.us-au .nm b{font-weight:700}
.us-au .s{font-size:13px;color:var(--text2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.us-au .s b{color:var(--text);font-weight:600}
.us-au .r{font-size:13px;color:var(--text2);flex:none;white-space:nowrap}
.us-au .r b{color:var(--text);font-weight:600}
.us-empty{display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;padding:80px 16px 96px}
.us-empty>.icon{width:40px;height:40px;color:var(--text2);stroke-width:1.3}
.us-empty b{font-size:17px;font-weight:700;max-width:440px}
.us-empty .caption{max-width:440px;line-height:1.55}
.us-empty .btn-quiet,.us-empty .btn-ink2{margin-top:8px}
.us-empty.us-none{padding-bottom:0;padding-top:60px}
.us-try{margin:36px 0 56px;display:flex;flex-direction:column;align-items:center;gap:12px}
.us-try .us-chiprow{justify-content:center}
.us-next{display:flex;flex-direction:column;align-items:center;gap:10px;padding:28px 0 8px}
.us-next .btn-quiet{cursor:pointer;background:transparent}
@media (max-width:1100px){
  .us-sw{display:none}
  .us-kbd{display:none}
  .hdr.us-open .us-sw{display:flex;flex:1;width:auto;max-width:none;margin:0 8px}
  .hdr.us-open .us-sw .search{display:flex}
  .hdr.us-open .sp,.hdr.us-open .srch-ib{display:none}
}
@media (max-width:640px){
  .hdr.us-open .us-sw{position:fixed;inset:0;z-index:50;margin:0;background:var(--ground);flex-direction:column}
  .hdr.us-open .us-bar{height:60px;padding:0 14px;border-bottom:1px solid var(--hairline);flex:none}
  .hdr.us-open .us-field{height:40px;border:1.5px solid var(--text);padding:0 12px}
  .us-field input{font-size:16px}
  .hdr.us-open .us-cancel{display:inline-flex}
  .us-drop{position:static;flex:1;min-height:0;border:0;border-radius:0;box-shadow:none!important;max-height:none;padding:4px 6px 24px;background:var(--ground)}
  .us-foot{display:none}
  .us-foot.loc{display:flex;border-top:0;margin-top:2px}
  .us-foot.loc>:not(.us-local){display:none}
  .us-mpill{display:flex;align-items:center;gap:8px;width:100%;height:42px;border:1px solid var(--chip);border-radius:999px;padding:0 12px;margin:0 0 16px;background:transparent;color:var(--text);font:15px var(--font);cursor:pointer;text-align:left}
  .us-mpill .icon{width:18px;height:18px;color:var(--text2)}
  .us-mpill .tx{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .us-mpill .tx.ph{color:var(--text2)}
  .us-h1{font-size:22px}
  .us-h1 .us-tchip{height:28px;font-size:14px}
  .us-tabs a .c{margin-left:0}
  .us-grid{grid-template-columns:repeat(3,1fr);margin:0 -16px}
  .us-au{padding:10px 0;gap:12px}
  .us-au .r{display:none}
  .us-jump{margin-top:-6px}
  .us-empty{padding:56px 0 64px}
}
@media (prefers-reduced-motion:reduce){.us-sw{transition:none}}
@media (max-width:640px){.us-row .us-k{display:none}}

/* refine — search within results (refine.go, refine.js; mock search-refine A R1–R4, T1–T3, M1, W1) */
.rf{position:relative;margin:4px 0 16px}
.rf-band{display:flex;align-items:center;gap:6px 10px;flex-wrap:wrap}
.rf-list{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;align-items:center;gap:6px;min-width:0}
.rf-c{display:inline-flex;align-items:center;gap:6px;min-width:0}
.rf-gt{color:var(--text2);font-size:13px}
.rf-chip{height:30px;padding:0 4px 0 12px;border-radius:999px;border:1px solid var(--chip);font-size:13px;font-weight:600;display:inline-flex;align-items:center;gap:2px;color:var(--text);max-width:240px}
.rf-c.fx .rf-chip,.rf-c:only-child .rf-chip{padding-right:12px}
.rf-chip .tx{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rf-c.new .rf-chip{background:var(--text);color:var(--ground);border-color:var(--text);padding-right:12px}
.rf-x{width:24px;height:24px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;color:var(--text2);flex:none}
.rf-x:hover{color:var(--text);background:var(--hairline)}
.rf-x .icon{width:13px;height:13px;stroke-width:2.4}
.rf-clr{margin-left:auto;font-size:12px;font-weight:600;color:var(--text2);text-decoration:none;white-space:nowrap}
.rf-clr:hover{color:var(--text)}
.rf-btn{height:30px;padding:0 12px;border-radius:999px;border:1px solid var(--chip);background:transparent;color:var(--text);font:600 13px var(--font);display:inline-flex;align-items:center;gap:6px;cursor:pointer;white-space:nowrap;flex:none}
.rf-btn .icon{width:15px;height:15px}
.rf-btn:hover,.rf-btn.on{border-color:var(--text)}
.rf-btn.on{background:var(--text);color:var(--ground)}
.rf-btn[aria-disabled="true"]{opacity:.45;cursor:default}
.us-bar2 .rf-btn{margin-left:auto}
.us-bar2 .rf-btn+.us-sort{margin-left:0}
.pw-resbar{align-items:center;gap:8px 12px;flex-wrap:wrap}
.pw-resbar .rf-btn{margin-left:auto}
.pw-resbar>*{min-width:0}
.us-bar2{min-width:0}
/* Archive selection mode: the band and its button wait (archive.js selecting) */
.ar.selecting .rf-x,.ar.selecting .rf-clr,.ar.selecting .rf-btn,.ar.selecting .rf-dropbtn{pointer-events:none;opacity:.4}
.rf-in{position:relative;margin-top:10px;max-width:520px}
.rf-form{height:40px;border:1.5px solid var(--text);border-radius:10px;display:flex;align-items:center;gap:8px;padding:0 6px 0 12px;color:var(--text2)}
.rf-form .icon{width:18px;height:18px;flex:none}
.rf-q{border:0;background:transparent;outline:0;flex:1;min-width:0;font:15px var(--font);color:var(--text)}
.rf-q::placeholder{color:var(--text2)}
.rf-q::-webkit-search-cancel-button{display:none}
.rf-cancel{border:0;background:transparent;font:600 14px var(--font);color:var(--text);cursor:pointer;padding:6px 8px;flex:none}
.rf-drop{position:absolute;top:46px;left:0;right:0;z-index:20;background:var(--menu);border:1px solid var(--hairline);border-radius:12px;padding:6px;display:flex;flex-direction:column;max-height:360px;overflow-y:auto;overscroll-behavior:contain}
.rf-msg{margin:8px 0 0;font-size:13px;color:var(--text)}
.rf-none .btn-quiet{margin-top:8px}
@media (max-width:640px){
  .rf-chip{max-width:180px}
  .rf-btn{white-space:normal;height:auto;min-height:30px;text-align:left}
  .rf-in{max-width:none}
  .rf-q{font-size:16px}
}

/* contact — Contact us (contact.go; mock search-contact-v1 C0–C5) */
.side .sub a .cnt,.dsub a .cnt{margin-left:auto;padding-right:10px;font-size:12px;font-weight:500;color:var(--text2)}
.ct-w{max-width:780px}
.ct-w .caption,.ct-det .caption,.ct-sent .caption,.ct-c0 .caption{font-size:13px;font-weight:500;letter-spacing:.02em;line-height:1.35;color:var(--text2)}
.ct-w .label,.ct-det .label{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text2)}
.ct-btnt{height:40px;padding:0 12px;font-size:14px;font-weight:600;color:var(--text2);display:inline-flex;align-items:center;white-space:nowrap;text-decoration:none;border-radius:6px}
.ct-btnt:hover{color:var(--text)}
.ct-w .btn-ink2,.ct-det .btn-ink2,.ct-c0 .btn-ink2{gap:6px;font-size:14px;font-weight:700}
.ct-w .btn-ink2 .icon,.ct-det .btn-ink2 .icon{width:18px;height:18px;stroke-width:2}
.ct-w button.btn-quiet,.ct-sent .btn-quiet{background:transparent;color:var(--text);cursor:pointer}
/* C0 signed out, restricted */
.ct-c0{max-width:560px;padding:30px 0}
.ct-lead{font-size:16px;line-height:1.65;margin:14px 0 22px}
.ct-alt{margin-top:22px;padding-top:18px;border-top:1px solid var(--hairline);display:flex;flex-direction:column;gap:10px;font-size:14px;line-height:1.6;color:var(--text2)}
.ct-alt a{color:var(--text);font-weight:600;text-decoration:none;display:inline-flex;align-items:center;gap:2px;align-self:flex-start}
.ct-alt a:hover{text-decoration:underline;text-underline-offset:3px}
.ct-r90{width:16px;height:16px;transform:rotate(-90deg)}
/* C1 list */
.ct-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.ct-head .caption{margin-top:8px;display:block;line-height:1.5}
.ct-list{margin-top:24px;border-top:1px solid var(--hairline)}
.ct-tk{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:20px;row-gap:5px;padding:16px 12px;border-bottom:1px solid var(--hairline);text-decoration:none;color:var(--text)}
.ct-tk:hover{background:var(--tile)}
.ct-tk .l1{display:flex;align-items:center;gap:14px;grid-column:1}
.ct-tk .no{font-size:13px;font-weight:600;color:var(--text2);letter-spacing:.02em}
.ct-tk .ttl{grid-column:1;font-size:16px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ct-tk.ct-done .ttl{color:var(--text2)}
.ct-tk .l3{grid-column:1;font-size:13px;color:var(--text2)}
.ct-tk .nw{grid-column:2;grid-row:1/4;align-self:center;display:flex;align-items:center;gap:6px;font-size:13px;font-weight:600;white-space:nowrap}
.ct-tk .nw i{width:6px;height:6px;border-radius:50%;background:var(--text)}
.ct-tk .chv2{grid-column:2;grid-row:1/4;align-self:center;width:18px;height:18px;transform:rotate(-90deg);color:var(--text2)}
.ct-st{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--text);white-space:nowrap}
.ct-st i{width:10px;height:10px;border-radius:50%;border:1.5px solid var(--text);display:block;flex:none}
.ct-st.s-in_progress i{background:linear-gradient(90deg,var(--text) 50%,transparent 50%)}
.ct-st.s-done{color:var(--text2)}
.ct-st.s-done i{background:var(--text2);border-color:var(--text2)}
.ct-end{padding:16px 12px;font-size:13px;color:var(--text2)}
.ct-empty{display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;padding:80px 20px}
.ct-empty .icon{width:40px;height:40px;color:var(--text2);stroke-width:1.3}
.ct-empty b{font-size:17px;font-weight:700;max-width:420px}
.ct-empty .caption{max-width:420px;line-height:1.55}
/* C2 new inquiry */
.ct-bk{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:600;color:var(--text2);margin:0 0 14px;text-decoration:none}
.ct-bk:hover{color:var(--text)}
.ct-bk .icon{width:18px;height:18px;transform:rotate(90deg);stroke-width:2}
.ct-fm{display:flex;flex-direction:column;gap:28px;max-width:720px;margin-top:26px}
.ct-fld{border:0;margin:0;padding:0;min-width:0}
.ct-fld>.label{display:flex;align-items:baseline;gap:8px;margin-bottom:10px;padding:0}
.ct-fld>.label .ct-opt{text-transform:none;letter-spacing:0;font-weight:500;font-size:12px}
.ct-radios{display:grid;grid-template-columns:1fr 1fr;column-gap:32px}
.ct-radio{display:flex;align-items:center;gap:12px;height:48px;padding:0 6px;border-bottom:1px solid var(--hairline);font-size:15px;cursor:pointer;position:relative}
.ct-radio:nth-child(-n+2){border-top:1px solid var(--hairline)}
.ct-radio input{position:absolute;opacity:0;width:1px;height:1px;margin:0}
.ct-radio i{width:22px;height:22px;border-radius:50%;border:1.5px solid var(--chip);flex:none;position:relative}
.ct-radio:hover i{border-color:var(--text2)}
.ct-radio:has(input:checked){font-weight:600}
.ct-radio:has(input:checked) i{border-color:var(--text)}
.ct-radio:has(input:checked) i::after{content:"";position:absolute;inset:4.5px;border-radius:50%;background:var(--text)}
.ct-radio:has(input:focus-visible){outline:2px solid var(--text);outline-offset:-2px;border-radius:4px}
.ct-inp{display:block;width:100%;border:1px solid var(--chip);border-radius:8px;min-height:46px;padding:11px 14px;font:400 15px/1.6 var(--font);color:var(--text);background:transparent;outline:0}
.ct-inp::placeholder{color:var(--text2)}
.ct-inp:focus{border:1.5px solid var(--text);padding:10.5px 13.5px}
.ct-ta{min-height:190px;resize:vertical}
.ct-ta.sm{min-height:120px}
.ct-cnt{display:flex;justify-content:space-between;gap:12px;margin-top:6px;font-size:12px;color:var(--text2);font-weight:500;min-height:16px}
.ct-cnt .r{margin-left:auto}
.ct-cnt .over{color:var(--text);font-weight:700}
.ct-thumbs{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.ct-th{width:64px;height:64px;background:var(--tile);position:relative;flex:none;display:block}
.ct-th img{width:100%;height:100%;object-fit:cover;display:block}
.ct-th.rej{display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:600;color:var(--text2);text-align:center;padding:2px}
.ct-th .rx{position:absolute;right:-7px;top:-7px;width:20px;height:20px;border-radius:50%;background:#0B0B0B;color:#F2F2F2;border:0;padding:0;display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 2px var(--ground);cursor:pointer}
.ct-th .rx .icon{width:12px;height:12px;stroke-width:2.4}
.ct-addph{width:64px;height:64px;border:1px dashed var(--chip);background:transparent;display:flex;align-items:center;justify-content:center;color:var(--text2);flex:none;cursor:pointer;padding:0;border-radius:0}
.ct-addph:hover{border-color:var(--text);color:var(--text)}
.ct-addph .icon{width:20px;height:20px}
.ct-foot{display:flex;align-items:center;justify-content:space-between;gap:16px;border-top:1px solid var(--hairline);padding-top:18px}
.ct-info{display:flex;flex-direction:column;gap:4px;min-width:0}
.ct-acts{display:flex;gap:8px;align-items:center}
.ct-err{font-size:13px;color:var(--text);font-weight:600;margin:0}
/* picker dialog */
.ct-pk{width:min(920px,calc(100vw - 32px));padding:22px 24px 18px;display:none;flex-direction:column;gap:14px}
.ct-pk[open]{display:flex}
.ct-pkhd{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap}
.ct-pgrid{display:grid;grid-template-columns:repeat(6,1fr);gap:2px;max-height:min(430px,calc(100vh - 220px));overflow-y:auto;overscroll-behavior:contain}
.ct-pt{aspect-ratio:1;background:var(--tile);display:block;position:relative;border:0;padding:0;margin:0;cursor:pointer;overflow:hidden;color:var(--text2)}
.ct-pt img{width:100%;height:100%;object-fit:cover;display:block}
.ct-pt .rl{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600}
.ct-pt .o{position:absolute;right:6px;top:6px;width:24px;height:24px;border-radius:50%;box-shadow:inset 0 0 0 2px #F2F2F2;background:rgba(0,0,0,.25);font-size:13px;font-weight:700;display:flex;align-items:center;justify-content:center}
.ct-pt.ct-on{box-shadow:inset 0 0 0 3px var(--text)}
.ct-pt.ct-on img{transform:scale(.94)}
.ct-pt.ct-on .o{background:#F2F2F2;box-shadow:none;color:#0B0B0B}
.ct-pt:disabled{opacity:.45;cursor:default}
.ct-pt:focus-visible{outline:2px solid var(--text);outline-offset:-2px}
.ct-pkst{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.ct-pkft{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:4px;flex-wrap:wrap}
.ct-pkft .caption b{color:var(--text)}
.ct-pkft .acts{display:flex;gap:8px;margin:0}
/* C3 sent */
.ct-sent{display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px;padding:64px 20px;max-width:540px;margin:0 auto;position:relative}
.ct-ck{width:56px;height:56px;border-radius:50%;border:1.5px solid var(--text);display:flex;align-items:center;justify-content:center;margin-bottom:6px}
.ct-ck .icon{width:28px;height:28px;stroke-width:2}
.ct-tnorow{display:flex;align-items:center;gap:12px;margin:2px 0 6px;flex-wrap:wrap;justify-content:center}
.ct-tno{font-size:28px;font-weight:700;letter-spacing:.06em;user-select:all}
.ct-copy{height:30px;padding:0 10px;border:1px solid var(--chip);border-radius:6px;background:transparent;color:var(--text);font:600 13px var(--font);display:inline-flex;align-items:center;gap:5px;cursor:pointer}
.ct-copy:hover{border-color:var(--text)}
.ct-copy .icon{width:15px;height:15px}
.ct-tx{font-size:15px;line-height:1.65;color:var(--text2);margin:0 0 14px}
.ct-toast{position:fixed;left:50%;bottom:28px;transform:translateX(-50%);background:var(--text);color:var(--ground);font-size:14px;font-weight:600;padding:10px 16px;border-radius:8px;z-index:50;white-space:nowrap}
body:has(.ckbar) .ct-toast{bottom:calc(var(--ckh,120px) + 8px)}
/* C4–C5 ticket */
.ct-det{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:48px;align-items:start;max-width:1080px}
.ct-main{min-width:0}
.ct-tnoh{font-size:28px;font-weight:700;letter-spacing:.04em;margin:0;line-height:1.15}
.ct-tsub{font-size:17px;font-weight:600;margin:6px 0 0;line-height:1.4}
.ct-prog{display:flex;align-items:flex-start;margin:22px 0;max-width:460px}
.ct-prog .s{display:flex;flex-direction:column;align-items:center;gap:7px;font-size:13px;color:var(--text2);flex:none;width:60px;font-weight:500;text-align:center;position:relative;z-index:1}
.ct-prog .s i{width:12px;height:12px;border-radius:50%;border:1.5px solid var(--chip);background:var(--ground);position:relative;display:block}
.ct-prog .s.past{color:var(--text)}
.ct-prog .s.past i{background:var(--text);border-color:var(--text)}
.ct-prog .s.now{color:var(--text);font-weight:600}
.ct-prog .s.now i{border-color:var(--text)}
.ct-prog .s.now i::after{content:"";position:absolute;inset:2px;border-radius:50%;background:var(--text)}
.ct-prog .ln{flex:1;height:1px;background:var(--rule);margin:6px -18px 0}
.ct-prog .ln.past{background:var(--text)}
.ct-msgs{border-top:1px solid var(--hairline)}
.ct-msg{padding:20px 0;border-bottom:1px solid var(--hairline);display:flex;flex-direction:column;gap:10px}
.ct-msg .mh{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ct-msg .fg{width:22px;height:22px;border-radius:50%;border:1px solid var(--chip);display:flex;align-items:center;justify-content:center;flex:none}
.ct-msg .fg .icon{width:13px;height:13px}
.ct-msg .who{font-size:14px;font-weight:600}
.ct-msg .body{font-size:15px;line-height:1.65;margin:0;white-space:pre-line;user-select:text}
.ct-msg .tt{font-size:16px;font-weight:700}
.ct-msg .ct-res{margin-bottom:-2px}
.ct-follow{margin-top:26px;display:flex;flex-direction:column}
.ct-follow>.label{margin-bottom:10px}
.ct-row2{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:10px}
.ct-row2 .ct-note{min-width:0}
.ct-row2 .ct-r{display:flex;align-items:center;gap:14px;flex:none}
.ct-follow .ct-err{margin-top:10px}
.ct-unsent{margin-top:22px;padding:14px 16px;border:1px solid var(--rule);border-radius:10px;display:flex;flex-direction:column;gap:8px}
.ct-unsent .mh{display:flex;align-items:center;justify-content:space-between;gap:10px}
.ct-unsent .body{font-size:14px;line-height:1.6;margin:0;white-space:pre-wrap;user-select:text;color:var(--text);max-height:240px;overflow:auto}
.ct-closed{margin-top:22px;display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.ct-closed .caption{font-size:14px;line-height:1.6}
.ct-aside{display:flex;flex-direction:column;border-top:1px solid var(--hairline);margin-top:6px}
.ct-aside .irow{display:flex;flex-direction:column;gap:4px;padding:12px 0;border-bottom:1px solid var(--hairline)}
.ct-aside .v{font-size:14px;line-height:1.5}
.ct-aside>.caption{padding-top:12px;line-height:1.55}
@media (max-width:1100px){
  .ct-det{grid-template-columns:minmax(0,1fr);gap:0}
  .ct-aside{display:none}
  .ct-pgrid{grid-template-columns:repeat(5,1fr)}
}
@media (max-width:640px){
  .ct-head .btn-ink2{height:36px;padding:0 12px;font-size:13px}
  .ct-tk{padding:14px 0;column-gap:12px}
  .ct-end{padding:16px 0}
  .ct-tk:hover{background:transparent}
  .ct-radios{grid-template-columns:1fr}
  .ct-radio:nth-child(2){border-top:0}
  .ct-fm{gap:24px;margin-top:18px}
  .ct-foot{flex-direction:column;align-items:stretch}
  .ct-foot .ct-acts .btn-ink2{flex:1;justify-content:center}
  .ct-pk{padding:18px 16px 14px}
  .ct-pgrid{grid-template-columns:repeat(3,1fr)}
  .ct-sent{padding:40px 0}
  .ct-tnoh{font-size:24px}
  .ct-prog{margin:18px 0}
  .ct-row2 .ct-note{display:none}
  .ct-row2{justify-content:flex-end}
  .ct-row2 .btn-ink2{min-width:96px;justify-content:center}
}
/* 앱에서 열기 on a phone (applink.go, contest.md §7.10) */
.ct-openapp{margin:12px 0 4px}
.ct-openapp .btn-quiet{width:100%;justify-content:center;height:44px;font-size:15px;background:var(--menu)}
.ct-openapp .caption{margin:8px 2px 0;font-size:12px;line-height:1.5;color:var(--text2)}

/* album links /s/{token} (share.go, share.js; album-share.md §6.1; mock album-share/layout-v1.html 5-a…5-e) */
.sh-top{border-bottom:1px solid var(--hairline)}
.sh-top .lp-top{padding-block:12px}
.sh-browse{height:36px;background:transparent;color:var(--text)}
.sh-browse .s{display:none}
.sh-head{padding-block:36px 22px}
.sh-head h1{margin:0;font-size:40px;line-height:1.14;font-weight:800;letter-spacing:-.02em;overflow-wrap:anywhere;text-wrap:balance}
.sh-desc{margin:10px 0 0;font-size:16px;line-height:1.55;max-width:46em;white-space:pre-line;overflow-wrap:anywhere}
.sh-by{margin:16px 0 0;display:flex;align-items:center;flex-wrap:wrap;gap:6px;font-size:14px;color:var(--text2)}
.sh-by .sep{color:var(--chip)}
.sh-au{display:inline-flex;align-items:center;gap:8px;color:var(--text);text-decoration:none;min-width:0;max-width:100%}
.sh-au b{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
a.sh-au:hover b{text-decoration:underline;text-underline-offset:3px}
.sh-au .avatar{width:28px;height:28px;margin:0;font-size:12px;color:var(--text2);flex:none}
.sh-body{padding-bottom:40px}
.sh-orig{margin:10px 0 0;display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--text)}
.sh-orig .icon{width:16px;height:16px;stroke-width:1.8}
.sh-orig[hidden],.sh-dl[hidden]{display:none}
.sh-cell{position:relative;min-width:0}
.sh-dl{position:absolute;right:6px;bottom:6px;width:32px;height:32px;border-radius:16px;background:rgba(0,0,0,.6);color:#fff;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .15s}
.sh-dl .icon{width:17px;height:17px;stroke-width:2}
.sh-cell:hover .sh-dl,.sh-dl:focus-visible{opacity:1}
.sh-dl:focus-visible{outline:2px solid #fff;outline-offset:-2px}
@media (hover:none){.sh-dl{display:none}}
.sh-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:3px}
.sh-tile{position:relative;display:block;aspect-ratio:1;background:var(--tile);overflow:hidden;cursor:zoom-in}
.sh-tile img{width:100%;height:100%;object-fit:cover;display:block;-webkit-user-drag:none;user-select:none;-webkit-touch-callout:none}
.sh-tile:focus-visible{outline:2px solid var(--text);outline-offset:-2px}
.sh-none{padding:48px 0;text-align:center}
.sh-foot{margin-top:auto}
.sh-about{color:var(--text2)}
.sh-about b{color:var(--text);margin-right:8px}
.sh-gone{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding-block:96px 120px}
.sh-gone h1{margin:0 0 8px;font-size:24px;line-height:1.3;font-weight:800;letter-spacing:-.01em}
.sh-gone p{margin:0 0 24px;color:var(--text2)}
.sh-goneic{width:84px;height:62px;margin-bottom:26px;border:1.5px solid var(--chip);border-radius:2px;background:linear-gradient(to top right,transparent calc(50% - 1px),var(--chip) calc(50% - .5px),var(--chip) calc(50% + .5px),transparent calc(50% + 1px))}
.sh main{padding:0;display:flex;flex-direction:column}
/* the large view (5-c) */
.sh-viewer{position:fixed;inset:0;z-index:100;background:#000;color:#F2F2F2;display:grid;grid-template-rows:auto minmax(0,1fr) auto;grid-template-columns:minmax(0,1fr);overflow:hidden;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
.sh-viewer[hidden]{display:none}
.sh-vbar{min-width:0;display:flex;align-items:center;justify-content:space-between;padding:12px 16px;padding-top:max(12px,env(safe-area-inset-top,0px))}
.sh-vpos{font-size:14px;font-weight:600;color:#BDBDBD;font-feature-settings:"tnum"}
.sh-vbtn{width:44px;height:44px;border:0;border-radius:22px;background:rgba(255,255,255,.08);color:#F2F2F2;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;padding:0}
.sh-vbtn:hover{background:rgba(255,255,255,.16)}
.sh-vbtn:focus-visible{outline:2px solid #F2F2F2;outline-offset:2px}
.sh-vbtn:disabled{opacity:.25;cursor:default}
.sh-vbtn .icon{width:24px;height:24px;stroke-width:2}
.sh-vprev,.sh-vnext{position:absolute;top:50%;margin-top:-22px}
.sh-vprev{left:16px}
.sh-vnext{right:16px}
.sh-vprev .icon{transform:rotate(90deg)}
.sh-vnext .icon{transform:rotate(-90deg)}
.sh-vstage{position:relative;min-height:0;min-width:0;display:flex;align-items:center;justify-content:center;padding:0 76px}
.sh-vstage img{max-width:100%;max-height:100%;object-fit:contain;display:block;-webkit-user-drag:none;transition:opacity .2s}
.sh-viewer.loading .sh-vstage img{opacity:.35}
.sh-vmsg{position:absolute;inset:auto 16px 50%;margin:0;display:flex;flex-direction:column;align-items:center;gap:12px;font-size:14px;text-align:center}
.sh-vmsg[hidden]{display:none}
.sh-vmsg .btn-quiet{background:transparent;color:#F2F2F2;border-color:#555;cursor:pointer}
.sh-vcap{min-width:0;padding:14px 16px 18px;padding-bottom:max(18px,env(safe-area-inset-bottom,0px));display:flex;align-items:center;justify-content:center;gap:16px;min-height:62px}
.sh-vtx{display:flex;flex-direction:column;align-items:center;gap:2px;text-align:center;min-width:0;max-width:100%}
.sh-viewer.dl .sh-vcap{justify-content:space-between;max-width:1100px;width:100%;margin:0 auto;box-sizing:border-box}
.sh-viewer.dl .sh-vtx{align-items:flex-start;text-align:left}
.sh-vcap b{font-size:15px;font-weight:700;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sh-vtx span{font-size:13px;color:#BDBDBD}
.sh-vdl{flex:none;max-width:100%;height:40px;padding:0 14px;border:1px solid #555;border-radius:20px;background:transparent;color:#F2F2F2;font:600 14px var(--font);display:inline-flex;align-items:center;gap:6px;cursor:pointer;white-space:nowrap}
.sh-vdl .icon{width:17px;height:17px;stroke-width:2;flex:none}
.sh-vdl span{min-width:0;overflow:hidden;text-overflow:ellipsis}
.sh-vdl:hover{border-color:#F2F2F2}
.sh-vdl:focus-visible{outline:2px solid #F2F2F2;outline-offset:2px}
.sh-vdl:disabled{opacity:.5;cursor:default}
.sh-vdl[hidden]{display:none}
.sh-viewer .sh-toast{z-index:110;bottom:calc(84px + env(safe-area-inset-bottom,0px))}
@media (prefers-reduced-motion:reduce){.sh-vstage img,.sh-dl{transition:none}}
@media (max-width:640px){
  .sh .lp-wrap{padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
  .sh-head{padding-block:22px 16px}
  .sh-head h1{font-size:26px;line-height:1.2}
  .sh-desc{font-size:14px;margin-top:6px}
  .sh-by{margin-top:10px;font-size:13px}
  .sh-au .avatar{width:24px;height:24px;font-size:11px}
  .sh-grid{grid-template-columns:repeat(3,1fr);gap:2px}
  .sh .sh-body{padding-left:0;padding-right:0} /* the grid runs edge to edge (5-b) */
  .sh-browse{height:32px;padding:0 12px;font-size:13px}
  .sh-browse .l{display:none}
  .sh-browse .s{display:inline}
  .sh-vstage{padding:0}
  .sh-vprev,.sh-vnext{display:none}
  .sh-about{flex-basis:100%}
  .sh-vdl{height:36px;padding:0 12px;font-size:13px}
  /* the caption over the button, both full width (UAT 412 px) */
  .sh-viewer.dl .sh-vcap{flex-direction:column;align-items:stretch;gap:10px}
  .sh-viewer.dl .sh-vtx{align-items:center;text-align:center}
  .sh-viewer.dl .sh-vdl{align-self:center}
}

/* the Archive album page's [Share] and its dialog (album.go, albumshare.js; mock album-share 4-a) */
.al-sharechip{margin-left:8px;height:24px;padding:0 9px 0 7px;border:1px solid var(--chip);border-radius:999px;background:transparent;color:var(--text);font:700 12px var(--font);display:inline-flex;align-items:center;gap:4px;cursor:pointer;vertical-align:middle}
.al-sharechip .icon{width:14px;height:14px;stroke-width:1.8}
.al-sharechip:hover{border-color:var(--text)}
.al-card .m .icon{width:13px;height:13px;stroke-width:1.8;vertical-align:-2px;margin-left:4px}
.as-dlg{width:min(480px,calc(100vw - 32px))}
.as-dlg h2{margin-bottom:8px}
.as-body{margin:0 0 16px;font-size:14px;line-height:1.55;color:var(--text2)}
.as-body b{color:var(--text)}
.as-link{display:flex;gap:8px;margin:0 0 16px}
.as-link input{flex:1;min-width:0;height:40px;border:1px solid var(--rule);border-radius:6px;background:transparent;color:var(--text);font:500 14px var(--font);padding:0 12px;outline:0}
.as-link input:focus{border-color:var(--text)}
.as-facts{margin:0;padding:10px 0;border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline);display:flex;flex-direction:column;gap:6px;font-size:13px}
.as-facts div{display:flex;justify-content:space-between;gap:12px}
.as-facts dt{color:var(--text2)}
.as-facts dd{margin:0;text-align:right;font-weight:600}
.as-facts dd.mu{font-weight:500;color:var(--text2)}
.as-note{margin:12px 0 0;font-size:12px;line-height:1.55;color:var(--text2)}
.as-dlg .acts{align-items:center}
.as-dlg .acts .sp{flex:1}
.as-stop{border:0;background:transparent;color:var(--red);font:600 14px var(--font);padding:0;min-height:40px;cursor:pointer}
.as-ask{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.as-ask b{font-size:14px;color:var(--red)}
.as-ask .caption{flex-basis:100%;margin:0}
.as-dlg .btn-red{height:36px;padding:0 14px;font-size:14px}
.as-dlg [hidden],.al-sharechip[hidden]{display:none!important}
.as-opts{margin:12px 0 0}
.as-opts .ck-opt:first-child{border-top:0;padding-top:4px}
.as-opts .ck-opt:last-child{border-bottom:0}
.as-opts .ck-opt.sub{padding-left:22px}
.as-opts .ck-opt.sub:has(.ck-sw:disabled) span{opacity:.45}