@font-face { font-family:'Sora'; font-weight:200; font-style:normal; font-display:swap;
  src:url('fonts/sora-latin-200-normal.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; }
@font-face { font-family:'Sora'; font-weight:200; font-style:normal; font-display:swap;
  src:url('fonts/sora-latin-ext-200-normal.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-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family:'Sora'; font-weight:300; font-style:normal; font-display:swap;
  src:url('fonts/sora-latin-300-normal.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; }
@font-face { font-family:'Sora'; font-weight:300; font-style:normal; font-display:swap;
  src:url('fonts/sora-latin-ext-300-normal.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-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family:'Sora'; font-weight:400; font-style:normal; font-display:swap;
  src:url('fonts/sora-latin-400-normal.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; }
@font-face { font-family:'Sora'; font-weight:400; font-style:normal; font-display:swap;
  src:url('fonts/sora-latin-ext-400-normal.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-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }

[data-theme="dark"] {
  --glow:radial-gradient(80% 55% at 50% 38%,rgba(204,153,85,.055),transparent 72%);
  --bg:var(--glow),radial-gradient(125% 88% at 50% 16%,#1B1B23 0%,#101017 62%,#0B0B10 100%);
  --vignette:inset 0 0 80px 16px rgba(0,0,0,.5);
  --title:rgba(255,252,245,.95); --accent:rgba(220,188,135,.88);
  --sub:rgba(200,170,120,.7); --counter:rgba(200,170,120,.72); --hint:rgba(200,170,120,.54);
  --brand:rgba(200,170,120,.54); --micro:rgba(200,170,120,.5); --ghost:rgba(200,170,120,.62);
  --title-shadow:0 0 40px rgba(16,16,23,.95), 0 0 80px rgba(16,16,23,.8), 0 2px 4px rgba(16,16,23,.9);
  --mk-fall:rgba(204,153,85,.5); --mk-rise:#CC9955; --wm-the:rgba(239,234,224,.5); --wm-name:rgba(239,234,224,.95);
  --bm-shadow:drop-shadow(0 0 14px rgba(16,16,23,.9)) drop-shadow(0 2px 4px rgba(16,16,23,.9));
  --in-bg:rgba(255,250,240,.06); --in-border:rgba(200,170,120,.18); --in-focus:rgba(200,170,120,.4); --in-text:rgba(255,250,240,.92);
  --btn-bg:rgba(200,170,120,.14); --btn-border:rgba(200,170,120,.26); --btn-text:rgba(255,250,240,.9);
  --btn-ghost:rgba(200,170,120,.62); --btn-ghost-bdr:rgba(200,170,120,.2);
  --tog-bdr:rgba(200,170,120,.15); --tog-on:rgba(255,250,240,.95); --tog-off:rgba(200,170,120,.62); --tog-on-bg:rgba(200,170,120,.15);
  --grad:linear-gradient(transparent,rgba(16,16,23,.88) 32px,rgba(16,16,23,.99));
  --flash:rgba(255,250,240,.95); --flash-glow:rgba(200,170,120,.35);
  --cr-bg:rgba(16,16,23,.97); --cr-text:rgba(255,250,240,.9); --cr-sub:rgba(200,170,120,.72); --ab-text:rgba(255,250,240,.85);
  --wk-body:var(--ab-text); --wk-meta:rgba(255,250,240,.55);
  --seg-on-bg:#CC9955; --seg-on-text:#1A1714;
  --ph:rgba(200,170,120,.46); --blur:saturate(120%) blur(18px); --pill-bg:rgba(16,16,23,.45);
  --ring:rgba(200,170,120,.1); --scrim:rgba(11,11,16,.72);
}
[data-theme="light"] {
  --glow:radial-gradient(80% 55% at 50% 38%,rgba(120,140,160,.07),transparent 72%);
  --bg:var(--glow),radial-gradient(125% 88% at 50% 14%,#ECEFF2 0%,#E6EAEE 58%,#DFE4E9 100%);
  --vignette:inset 0 0 80px 16px rgba(120,130,140,.10);
  --title:rgba(27,30,33,.94); --accent:rgba(160,111,46,.92);
  --sub:rgba(94,100,106,.78); --counter:rgba(94,100,106,.85); --hint:rgba(150,156,161,.95);
  --brand:rgba(94,100,106,.72); --micro:rgba(150,156,161,.9); --ghost:rgba(94,100,106,.8);
  --title-shadow:0 0 40px rgba(236,239,242,.95), 0 0 80px rgba(236,239,242,.8), 0 2px 4px rgba(236,239,242,.9);
  --mk-fall:rgba(166,118,60,.5); --mk-rise:#A6763C; --wm-the:rgba(38,41,47,.55); --wm-name:rgba(38,41,47,.95);
  --bm-shadow:drop-shadow(0 0 14px rgba(236,239,242,.9)) drop-shadow(0 2px 4px rgba(236,239,242,.9));
  --in-bg:#FFFFFF; --in-border:#D8DDE0; --in-focus:rgba(160,111,46,.6); --in-text:rgba(27,30,33,.92);
  --btn-bg:rgba(204,153,85,.16); --btn-border:rgba(204,153,85,.4); --btn-text:rgba(27,30,33,.9);
  --btn-ghost:rgba(94,100,106,.82); --btn-ghost-bdr:rgba(94,100,106,.32);
  --tog-bdr:rgba(120,128,135,.3); --tog-on:rgba(27,30,33,.92); --tog-off:rgba(94,100,106,.72); --tog-on-bg:rgba(204,153,85,.18);
  --grad:linear-gradient(transparent,rgba(230,234,238,.9) 32px,rgba(230,234,238,.99));
  --flash:rgba(27,30,33,.92); --flash-glow:rgba(160,111,46,.2);
  --cr-bg:rgba(230,234,238,.97); --cr-text:rgba(27,30,33,.92); --cr-sub:rgba(94,100,106,.82); --ab-text:rgba(27,30,33,.85);
  --wk-body:var(--cr-sub); --wk-meta:var(--micro);
  --seg-on-bg:#CC9955; --seg-on-text:#1B1E21;
  --ph:rgba(150,156,161,.95); --blur:saturate(110%) blur(16px); --pill-bg:rgba(236,239,242,.62);
  --ring:rgba(160,111,46,.16); --scrim:rgba(20,22,24,.55);
}

html { background-color:var(--cr-bg); }
html, body { height:100%; width:100%; overflow:hidden; overscroll-behavior:none; }
body {
  background:var(--bg); color:var(--title); min-height:100dvh;
  box-shadow:var(--vignette);
  font-family:'Sora', system-ui, sans-serif;
  overflow:hidden;
  transition:background .5s ease;
  -webkit-font-smoothing:antialiased;
}

.noscript { text-align:center; padding:20vh 20px; color:var(--title); }
.noscript a { color:var(--accent); }

#app { position:fixed; inset:0; overflow:hidden; }
#app::before {
  content:""; position:absolute; inset:0; z-index:1; pointer-events:none; opacity:.025;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23g)'/%3E%3C/svg%3E") repeat;
}

#wall { position:fixed; inset:0; overflow:hidden; pointer-events:none; z-index:4; }
.drop {
  position:absolute; top:0; left:0;
  display:flex; align-items:baseline; gap:6px;
  line-height:1.4; letter-spacing:.01em;
  max-width:min(260px,62vw); overflow-wrap:break-word; word-break:break-word;
  user-select:none; -webkit-user-select:none; cursor:pointer;
  pointer-events:auto; will-change:transform,opacity;
  transform-origin:left center;
  transition:transform .2s ease-out, color .12s ease;
}
.drop.voted { cursor:default; }
.drop.uv { animation:uV .6s ease; }
.drop .vote { font-weight:400; white-space:nowrap; flex-shrink:0; }
.drop .vote.pulse { animation:uVp .4s ease-out; }
.drop .truon-mark { width:.85em; height:.85em; flex-shrink:0; opacity:.9; }
.drop .truon-mark svg { width:100%; height:100%; display:block; }

.plus-one {
  position:absolute; z-index:103; pointer-events:none;
  font-size:12px; font-weight:300; color:var(--accent);
  animation:uP 1s ease forwards;
}

#tapScrim {
  position:fixed; inset:0; z-index:100; background:var(--scrim);
  -webkit-backdrop-filter:saturate(115%) blur(3px); backdrop-filter:saturate(115%) blur(3px);
  animation:uF .25s ease;
}
#tapFocus { position:fixed; inset:0; z-index:101; pointer-events:none; }
#tapActions { position:fixed; z-index:102; display:flex; flex-wrap:wrap; max-width:calc(100vw - 24px); gap:8px; pointer-events:auto; animation:uF .25s ease; }
#tapActions button {
  display:inline-flex; align-items:center; gap:7px;
  background:var(--pill-bg); -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px);
  border:1px solid var(--tog-bdr); border-radius:8px;
  color:var(--btn-text); font-size:12px; font-weight:300; font-family:inherit; letter-spacing:.04em;
  padding:8px 15px; cursor:pointer; white-space:nowrap;
  transition:color .3s ease, border-color .3s ease, background .3s ease;
}
#feelBtn { color:var(--accent); border-color:var(--btn-ghost-bdr); }
#tapActions button:hover, #tapActions button:focus-visible { color:var(--accent); border-color:var(--ghost); }
#feelBtn.felt { color:var(--micro); cursor:default; }
#feelBtn.felt:hover, #feelBtn.felt:focus-visible { color:var(--micro); border-color:var(--tog-bdr); }
#tapActions .ta-ic, #tapActions .ta-mk { width:16px; height:16px; flex-shrink:0; }
#tapActions .ta-mk svg { width:100%; height:100%; display:block; }

#title {
  position:fixed; top:max(6%, 96px); left:50%; transform:translateX(-50%);
  text-align:center; z-index:10; pointer-events:none; width:90%; max-width:600px;
  animation:uT .9s ease;
}
#title .sub .bm { display:block; margin:0 auto; height:clamp(16px,3.4vw,19px); width:auto; filter:var(--bm-shadow); }
#title .bm-f { stroke:var(--mk-fall); }
#title .bm-r { stroke:var(--mk-rise); }
#title .bm-t { fill:var(--wm-the); }
#title .bm-n { fill:var(--wm-name); }
#title .counter { margin-top:12px; font-size:clamp(11px,2.2vw,13px); font-weight:300; color:var(--counter); letter-spacing:.05em; text-shadow:var(--title-shadow); }
#title .counter .cnt-n { font-weight:600; }
#title .hint { margin-top:3px; font-size:clamp(9px,1.45vw,11px); font-weight:200; color:var(--hint); letter-spacing:.05em; font-style:italic; text-shadow:var(--title-shadow); }
.sub-row { display:flex; align-items:center; justify-content:center; gap:10px; margin-bottom:2px; }

#controls { position:fixed; top:10px; right:12px; z-index:20; display:flex; gap:5px; }
.pill { display:flex; background:var(--pill-bg); -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px); border:1px solid var(--tog-bdr); border-radius:8px; overflow:hidden; }
.tog { padding:0 10px; min-height:42px; min-width:44px; font-size:11px; font-weight:400; line-height:1; font-family:inherit; letter-spacing:.08em; color:var(--tog-off); background:transparent; border:none; cursor:pointer; text-transform:uppercase; transition:all .3s ease; }
.tog.on { color:var(--seg-on-text); background:var(--seg-on-bg); }
.theme-tog {
  width:44px; height:44px; display:inline-flex; align-items:center; justify-content:center;
  background:var(--pill-bg); -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px);
  border:1px solid var(--tog-bdr); border-radius:8px; cursor:pointer;
  color:var(--tog-off); transition:color .3s ease;
}
.theme-tog:hover, .theme-tog:active { color:var(--accent); }
.theme-tog svg { width:14px; height:14px; }

.pill-btn {
  display:inline-flex; align-items:center; justify-content:center; min-height:44px;
  background:var(--pill-bg); -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px);
  border:1px solid var(--tog-bdr); border-radius:8px;
  color:var(--micro); font-size:11px; font-weight:400; font-family:inherit; letter-spacing:.08em; text-transform:uppercase;
  padding:0 10px; cursor:pointer; transition:color .3s ease;
}
#support { position:fixed; top:10px; left:12px; z-index:20; }
.pill-btn:hover { color:var(--ghost); }
#infoBtn { color:var(--tog-off); }
#infoBtn:hover, #infoBtn:active { color:var(--accent); }

#flash {
  position:fixed; top:32%; left:50%; transform:translate(-50%,-50%);
  font-size:clamp(17px,4vw,24px); font-weight:200; color:var(--flash);
  text-align:center; max-width:80%; z-index:50; line-height:1.4;
  text-shadow:0 0 40px var(--flash-glow); pointer-events:none;
  animation:uFl 3.2s ease forwards;
}

#bottom {
  position:fixed; bottom:0; left:0; right:0; z-index:20;
  background:var(--grad); -webkit-backdrop-filter:var(--blur); backdrop-filter:var(--blur);
  padding:40px 16px calc(16px + env(safe-area-inset-bottom));
}
#inputPhase { max-width:460px; margin:0 auto; display:flex; gap:8px; align-items:flex-end; }
#msgInput {
  flex:1; background:var(--in-bg); border:1px solid var(--in-border); border-radius:8px;
  padding:12px 14px; font-size:16px; font-weight:200; font-family:inherit; color:var(--in-text);
  line-height:1.4; resize:none; overflow-y:hidden;
  outline:none; transition:border-color .3s ease;
}
#msgInput:focus { border-color:var(--in-focus); box-shadow:0 0 0 3px var(--ring); }
#msgInput::placeholder { color:var(--ph); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#submitBtn {
  background:var(--btn-bg); border:1px solid var(--btn-border); border-radius:8px;
  padding:12px 16px; font-size:12px; font-weight:300; font-family:inherit; color:var(--btn-text);
  cursor:pointer; letter-spacing:.06em; white-space:nowrap; transition:all .3s ease;
}
#submitBtn:disabled { background:transparent; border-color:var(--in-border); color:var(--micro); cursor:default; }
#submitBtn:not(:disabled):hover { background:var(--btn-border); border-color:var(--in-focus); }
#submitBtn.loading { position:relative; color:transparent; }
#submitBtn.loading::after {
  content:""; position:absolute; top:50%; left:50%;
  width:14px; height:14px; margin:-7px 0 0 -7px;
  border:2px solid var(--btn-border); border-top-color:var(--accent);
  border-radius:50%; animation:uS .7s linear infinite;
}

#toast {
  position:fixed; left:0; right:0; bottom:96px; z-index:25;
  display:flex; justify-content:center; padding:0 16px; pointer-events:none;
}
.toast-in {
  max-width:460px; padding:10px 16px; text-align:center;
  background:var(--pill-bg); -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px);
  border:1px solid var(--tog-bdr); border-radius:8px;
  opacity:0; transform:translateY(6px);
  transition:opacity .3s ease, transform .3s ease;
}
#toast.on .toast-in { opacity:1; transform:translateY(0); pointer-events:auto; cursor:pointer; }
.toast-msg { font-size:13px; font-weight:200; color:var(--btn-ghost); line-height:1.5; }
.toast-act { margin-top:8px; }

.cr-back {
  background:none; border:1px solid var(--btn-ghost-bdr); border-radius:6px;
  padding:7px 18px; font-size:11px; font-weight:300; font-family:inherit; color:var(--btn-ghost);
  cursor:pointer; transition:all .3s ease;
}
.foot { margin-top:14px; display:flex; align-items:center; justify-content:center; gap:9px; }
.foot a { font-size:9px; font-weight:300; letter-spacing:.16em; text-transform:uppercase; color:var(--brand); text-decoration:none; cursor:pointer; transition:color .3s ease; }
.foot a:hover { color:var(--accent); }
.foot-sep { font-size:9px; color:var(--micro); }

#crisis, #about, #weekly { background-color:var(--cr-bg); background-image:var(--glow); }
.ov-x {
  position:fixed; top:calc(10px + env(safe-area-inset-top)); right:calc(12px + env(safe-area-inset-right)); z-index:10;
  display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px;
  background:var(--pill-bg);
  border:1px solid var(--tog-bdr); border-radius:50%; cursor:pointer;
  color:var(--ghost); transition:color .3s ease;
}
.ov-x:hover, .ov-x:active { color:var(--accent); }
.ov-x svg { width:12px; height:12px; }
#crisis { position:fixed; inset:0; z-index:1000; display:flex; align-items:center; justify-content:center; animation:uF .4s ease; }
.crisis-box { max-width:400px; padding:36px 28px; text-align:center; }
.crisis-box .cr1 { font-size:18px; font-weight:300; color:var(--cr-text); line-height:1.55; margin-bottom:8px; }
.crisis-box .cr2 { font-size:14px; font-weight:300; color:var(--cr-sub); line-height:1.55; margin-bottom:28px; }
.cr-link { display:inline-block; padding:12px 24px; background:rgba(180,150,100,.08); border:1px solid rgba(180,150,100,.18); border-radius:8px; color:var(--cr-text); font-size:13px; font-weight:300; text-decoration:none; }
.cr-back { display:inline-flex; align-items:center; gap:6px; border:none; color:var(--ghost); font-size:11px; font-weight:200; margin-top:24px; padding:0; }

#about {
  position:fixed; inset:0; z-index:1000;
  display:flex; flex-direction:column; overflow-y:auto; animation:uF .4s ease;
}
.about-box { margin:auto; width:100%; max-width:34rem; padding:28px 28px calc(28px + env(safe-area-inset-bottom)); text-align:left; }
.about-box .about-title { font-size:18px; font-weight:300; color:var(--cr-text); line-height:1.4; text-align:center; margin-bottom:16px; }
.about-sec { margin-top:26px; }
.about-h { font-size:11px; font-weight:400; letter-spacing:.12em; text-transform:uppercase; color:var(--micro); margin-bottom:10px; }
.about-box .about-line { font-size:14px; font-weight:300; color:var(--ab-text); line-height:1.55; margin-bottom:12px; }
.about-sec .about-line:last-child, .lg-row:last-child { margin-bottom:0; }
.ab-accent { color:var(--accent); }
.ab-link {
  color:var(--accent); text-decoration:underline; text-decoration-thickness:1px;
  text-underline-offset:3px; text-decoration-color:var(--btn-ghost-bdr);
  transition:text-decoration-color .3s ease;
}
.ab-link:hover { text-decoration-color:var(--accent); }
.lg-row { display:flex; align-items:flex-start; margin-bottom:10px; }
.lg-row .about-line { margin-bottom:0; }
.lg-mk { flex:0 0 26px; }
.lg-dot { display:block; width:8px; height:8px; border-radius:50%; background:var(--accent); margin-top:7px; }
.lg-dot.dim { background:var(--ab-text); opacity:.45; }
.about-mark { color:var(--accent); }
.about-mark svg { width:16px; height:16px; display:block; margin:3px 0 0 -4px; }
.ab-ic { color:var(--accent); }
.ab-ic svg { width:16px; height:16px; display:block; margin-top:3px; }
#aboutDeep { margin-top:24px; }
.ab-more-row { text-align:center; margin-top:20px; }
.ab-more { display:inline-flex; align-items:center; gap:6px; background:none; border:none; padding:4px 8px; font-size:13px; font-weight:300; font-family:inherit; letter-spacing:.04em; color:var(--micro); cursor:pointer; transition:color .3s ease; }
.ab-more:hover, .ab-more:focus-visible { color:var(--ghost); }
.ab-chev, .cr-back svg { width:12px; height:12px; flex-shrink:0; }
.ab-chev { transition:transform .25s ease; }
.ab-more[aria-expanded="true"] .ab-chev { transform:rotate(180deg); }
.about-back { text-align:center; margin-top:18px; }
.about-back .cr-back { margin-top:0; }

.wk-row { margin-top:10px; display:flex; justify-content:center; position:relative; z-index:30; }
.wk-open {
  pointer-events:auto; display:inline-flex; align-items:center; gap:8px;
  background:var(--pill-bg); -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px);
  border:1px solid var(--tog-bdr); border-radius:6px; cursor:pointer; padding:13px 18px;
  font-size:12px; font-weight:400; font-family:inherit; letter-spacing:.16em; text-transform:uppercase;
  color:var(--sub); transition:color .3s ease, border-color .3s ease;
}
.wk-open:hover, .wk-open:active { color:var(--accent); border-color:var(--ghost); }
.wk-open.wk-off { visibility:hidden; }
.wk-open-mk { width:16px; height:16px; flex-shrink:0; }
.wk-open-mk svg { width:100%; height:100%; display:block; }
.wk-open.wk-intro { animation:uF .6s ease; }
.wk-open.wk-intro .wk-open-mk { animation:wkBreath 2s ease; }

#weekly {
  position:fixed; inset:0; z-index:1000;
  display:flex; flex-direction:column; overflow-y:auto; animation:uF .4s ease;
}
.wk-box { outline:none; padding-top:56px; }
.wk-head { font-size:16px; font-weight:400; letter-spacing:.22em; text-transform:uppercase; color:var(--cr-sub); text-align:center; }
.wk-truth { display:block; margin-top:26px; font-size:clamp(19px,5vw,22px); font-weight:200; color:var(--cr-text); line-height:1.5; text-align:center; }
.wk-item .wk-truth { margin-top:0; }
.wk-votes { margin-top:10px; font-size:12px; font-weight:400; letter-spacing:.04em; color:var(--accent); text-align:center; }
#wkArchive { margin-top:52px; }
.wk-arch-h { text-align:center; }
.wk-entry { margin-top:44px; }
#wkArchiveList .wk-entry:first-child { margin-top:24px; }
.wk-item { display:block; width:100%; background:none; border:none; padding:0; font-family:inherit; }
button.wk-item { cursor:pointer; }
.wk-item-meta { display:flex; justify-content:center; align-items:center; gap:6px; margin-top:10px; font-size:10px; font-weight:400; letter-spacing:.14em; text-transform:uppercase; color:var(--wk-meta); transition:color .3s ease; }
button.wk-item:hover .wk-item-meta, button.wk-item:focus-visible .wk-item-meta { color:var(--accent); }
.wk-chev { width:12px; height:12px; flex-shrink:0; transition:transform .25s ease; }
.wk-item[aria-expanded="true"] .wk-chev { transform:rotate(180deg); }
.wk-refl { margin-top:16px; animation:uF .3s ease; }
.wk-refl .about-line { font-size:14px; font-weight:300; color:var(--wk-body); line-height:1.6; }

::selection { background:var(--in-focus); color:var(--title); }
.tog:focus-visible, .pill-btn:focus-visible, #submitBtn:focus-visible, .cr-back:focus-visible, .cr-link:focus-visible, .ab-link:focus-visible, .foot a:focus-visible, #tapActions button:focus-visible, .ab-more:focus-visible, .theme-tog:focus-visible, .ov-x:focus-visible, .wk-open:focus-visible, .wk-item:focus-visible { outline:1px solid var(--in-focus); outline-offset:2px; }
#about, #weekly, #msgInput { scrollbar-width:thin; scrollbar-color:var(--in-border) transparent; }

[hidden] { display:none !important; }

@keyframes uFl { 0%{opacity:0;transform:translate(-50%,-50%) scale(.96)} 15%{opacity:1;transform:translate(-50%,-50%) scale(1)} 65%{opacity:1} 100%{opacity:0;transform:translate(-50%,-50%) scale(1.01)} }
@keyframes uF { from{opacity:0;transform:translateY(5px)} to{opacity:1;transform:translateY(0)} }
@keyframes uP { 0%{opacity:0;transform:translateY(0)} 20%{opacity:1} 100%{opacity:0;transform:translateY(-24px)} }
@keyframes uT { from{opacity:0;transform:translate(-50%,-8px)} to{opacity:1;transform:translate(-50%,0)} }
@keyframes uV { 0%,100%{text-shadow:0 0 0 transparent} 35%{text-shadow:0 0 18px var(--flash-glow)} }
@keyframes uVp { from{transform:scale(1.25)} to{transform:scale(1)} }
@keyframes uS { to { transform:rotate(360deg) } }
@keyframes wkBreath { 35%{color:var(--accent)} }

@media (min-width:1100px) {
  [data-theme="dark"] { --counter:rgba(200,170,120,.78); }
  [data-theme="light"] { --counter:rgba(94,100,106,.9); }
  #title .sub { font-size:18px; }
  #title .counter { margin-top:14px; font-size:16px; letter-spacing:.04em; }
  #title .hint { margin-top:6px; font-size:12.5px; }
  .drop { max-width:320px; }
}

@media (prefers-reduced-motion:reduce) {
  .drop { transition:none; }
  .drop.uv { animation:none; }
  .drop .vote.pulse { animation:none; }
  .ab-chev { transition:none; }
  #title { animation:none; }
  #flash { animation-duration:3.2s; }
  #tapScrim, #tapActions { animation:none; }
  #weekly { animation:none; }
  .wk-open.wk-intro, .wk-open.wk-intro .wk-open-mk { animation:none; }
  .wk-refl { animation:none; }
  .wk-chev { transition:none; }
  #toast .toast-in, #toast.on .toast-in { transition:none; transform:none; }
}