@font-face{font-family:Inter;src:url(fonts/Inter-var.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"JetBrains Mono";src:url(fonts/JetBrainsMono.woff2) format("woff2");font-weight:400;font-display:swap}
:root,[data-theme=dark]{color-scheme:dark;--bg:#08090c;--bg2:#0d0f14;--card:rgba(22,25,33,.62);--card-s:#14171e;--hov:rgba(255,255,255,.05);--line:rgba(255,255,255,.08);--line2:rgba(255,255,255,.14);--text:#ececf1;--text2:#c5c8d2;--mut:#8b90a0;--acc:#a5b4fc;--acc2:#818cf8;--btn:#6366f1;--btnh:#7577f5;--on:#ececf1;--onx:#08090c;--glow1:rgba(99,102,241,.22);--glow2:rgba(45,212,191,.10);--hdr:rgba(8,9,12,.72);--shadow:0 1px 0 rgba(255,255,255,.04) inset,0 8px 30px -12px rgba(0,0,0,.6);--bl:22%;--bt:85%;--bd:62%}
[data-theme=light]{color-scheme:light;--bg:#fbfbfc;--bg2:#f3f4f7;--card:rgba(255,255,255,.8);--card-s:#fff;--hov:rgba(15,18,30,.05);--line:rgba(15,18,30,.09);--line2:rgba(15,18,30,.16);--text:#0f1117;--text2:#353a47;--mut:#626878;--acc:#4f46e5;--acc2:#4f46e5;--btn:#4f46e5;--btnh:#4338ca;--on:#0f1117;--onx:#fff;--glow1:rgba(99,102,241,.14);--glow2:rgba(45,212,191,.10);--hdr:rgba(251,251,252,.75);--shadow:0 1px 2px rgba(15,18,30,.04),0 8px 24px -14px rgba(15,18,30,.18);--bl:93%;--bt:30%;--bd:45%}
*,*::before,*::after{box-sizing:border-box}button,input,select,textarea{font:inherit}html{-webkit-text-size-adjust:100%;scroll-padding-top:72px}
body{margin:0;font:16px/1.6 Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font-feature-settings:"cv11","ss01";letter-spacing:-.006em;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;min-height:100vh}
body::before{content:"";position:absolute;inset:0 0 auto;height:720px;z-index:-1;pointer-events:none;background:radial-gradient(60% 55% at 50% 0,var(--glow1),transparent 70%),radial-gradient(35% 40% at 85% 10%,var(--glow2),transparent 70%)}
body::after{content:"";position:absolute;inset:0 0 auto;height:620px;z-index:-1;pointer-events:none;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:48px 48px;-webkit-mask-image:radial-gradient(50% 60% at 50% 0,#000,transparent 75%);mask-image:radial-gradient(50% 60% at 50% 0,#000,transparent 75%);opacity:.5}
a{color:var(--acc);text-underline-offset:3px;text-decoration-thickness:1px}a:hover{color:var(--text)}img{max-width:100%;height:auto}
::selection{background:var(--btn);color:#fff}
:focus-visible{outline:2px solid var(--acc2);outline-offset:2px;border-radius:6px}
h1,h2,h3{letter-spacing:-.025em;font-weight:650;color:var(--text)}h2{font-size:clamp(20px,3.4vw,24px);margin:40px 0 14px}
/* header */
.top{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:8px;padding:10px max(16px,calc((100% - 1180px)/2 + 20px));background:var(--hdr);-webkit-backdrop-filter:saturate(180%) blur(14px);backdrop-filter:saturate(180%) blur(14px);border-bottom:1px solid var(--line)}
.logo{display:flex;align-items:center;gap:10px;font-weight:700;font-size:17px;letter-spacing:-.02em;color:var(--text);text-decoration:none;margin-right:auto}.logo img{width:28px;height:28px;border-radius:8px;transition:transform .3s cubic-bezier(.2,.8,.2,1)}.logo:hover{color:var(--text)}.logo:hover img{transform:rotate(-8deg) scale(1.05)}
.dnav{display:none;gap:2px}.dnav a{color:var(--mut);text-decoration:none;padding:7px 12px;border-radius:8px;font-size:14px;font-weight:500;transition:color .15s,background .15s}.dnav a:hover{color:var(--text);background:var(--hov)}
.tt{display:inline-grid;place-items:center;width:36px;height:36px;border-radius:9px;border:1px solid var(--line);background:transparent;color:var(--text);cursor:pointer;transition:background .15s,border-color .15s}.tt:hover{background:var(--hov);border-color:var(--line2)}
.tt span{width:16px;height:16px;border-radius:50%;box-shadow:inset -5px -3px 0 0 currentColor;transform:rotate(-20deg);transition:box-shadow .3s,transform .3s}
[data-theme=light] .tt span{box-shadow:inset 0 0 0 8px currentColor;transform:scale(.62);outline:2px dotted currentColor;outline-offset:3px}
.menu{position:relative}.menu summary{list-style:none;cursor:pointer;display:grid;place-items:center;width:36px;height:36px;font-size:18px;border:1px solid var(--line);border-radius:9px;color:var(--text);user-select:none}.menu summary:hover{background:var(--hov)}.menu summary::-webkit-details-marker{display:none}
.menu nav{position:absolute;right:0;top:46px;background:var(--card-s);border:1px solid var(--line2);border-radius:14px;padding:6px;display:flex;flex-direction:column;min-width:200px;box-shadow:0 20px 50px -10px rgba(0,0,0,.45);animation:pop .18s cubic-bezier(.2,.8,.2,1)}
.menu nav a{padding:11px 12px;color:var(--text);text-decoration:none;border-radius:9px;font-weight:500;font-size:15px}.menu nav a:hover{background:var(--hov)}
@media(min-width:900px){.dnav{display:flex}.menu{display:none}}
/* layout */
.wrap{max-width:1180px;margin:0 auto;padding:12px 16px 56px}@media(min-width:640px){.wrap{padding:16px 20px 72px}}
.hero{text-align:center;padding:44px 0 8px}@media(min-width:900px){.hero{padding:84px 0 16px}}
.hero h1{font-size:clamp(34px,7.4vw,64px);line-height:1.04;letter-spacing:-.045em;font-weight:720;margin:0 auto 16px;max-width:900px;background:linear-gradient(180deg,var(--text) 30%,color-mix(in srgb,var(--text) 62%,transparent));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero em{font-style:normal;background:linear-gradient(100deg,#818cf8,#5eead4);-webkit-background-clip:text;background-clip:text;color:transparent}
[data-theme=light] .hero em{background-image:linear-gradient(100deg,#4f46e5,#0d9488)}
.hero .lead{color:var(--mut);margin:0 auto 26px;max-width:620px;font-size:clamp(16px,2.2vw,18px);line-height:1.6}
#count{color:var(--text2);font-weight:500;white-space:nowrap}
#q{width:100%;max-width:620px;padding:15px 18px 15px 46px;border-radius:14px;border:1px solid var(--line2);background:var(--card) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='none' stroke='%238b90a0' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='8' cy='8' r='6'/%3E%3Cpath d='m13 13 4 4'/%3E%3C/svg%3E") no-repeat 17px 50%;color:var(--text);font:inherit;font-size:16px;box-shadow:var(--shadow);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:border-color .2s,box-shadow .2s}
#q::placeholder{color:var(--mut)}#q:focus{outline:0;border-color:var(--acc2);box-shadow:0 0 0 4px color-mix(in srgb,var(--acc2) 22%,transparent),var(--shadow)}
.chips{display:flex;gap:8px;overflow-x:auto;padding:12px 2px;scrollbar-width:none;-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity}.chips::-webkit-scrollbar{display:none}
.chip{flex:0 0 auto;scroll-snap-align:start;border:1px solid var(--line);background:var(--card);color:var(--text2);border-radius:999px;padding:7px 14px;font-family:inherit;font-size:13.5px;font-weight:500;line-height:1.3;cursor:pointer;white-space:nowrap;transition:background .15s,border-color .15s,color .15s,transform .15s}
.chip:hover{border-color:var(--line2);color:var(--text);background:var(--hov)}.chip:active{transform:scale(.97)}
.chip.on{background:var(--on);color:var(--onx);border-color:var(--on);font-weight:600}.chips.quick{justify-content:center;flex-wrap:wrap;padding-top:18px}
.filters{border:1px solid var(--line);border-radius:16px;background:var(--card);padding:4px 14px;margin:28px 0 18px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.flabel{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.09em;color:var(--mut);margin:12px 0 0}
.bar{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:14px;color:var(--mut);font-size:14px}.bar label{display:flex;align-items:center;gap:8px}
select{background:var(--card-s);color:var(--text);border:1px solid var(--line2);border-radius:9px;padding:8px 10px;font:inherit;font-size:14px}
.grid{display:grid;grid-template-columns:1fr;gap:14px}@media(min-width:640px){.grid{grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px}}
/* cards */
.card{position:relative;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:18px;display:flex;flex-direction:column;min-height:200px;box-shadow:var(--shadow);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);transition:border-color .2s,transform .25s cubic-bezier(.2,.8,.2,1),background .2s}
.card::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;background:linear-gradient(180deg,var(--line2),transparent 40%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.card:hover{border-color:var(--line2);transform:translateY(-2px)}
#list .card{animation:rise .4s cubic-bezier(.2,.8,.2,1) both}
.card h3{margin:12px 0 6px;font-size:16.5px;line-height:1.35;letter-spacing:-.015em;font-weight:620}.card h3 a{color:var(--text);text-decoration:none}.card h3 a::after{content:"";position:absolute;inset:0;border-radius:inherit}.card h3 a:hover{color:var(--acc)}
.card .tags,.card .row,.card button,.card .btn{position:relative;z-index:1}
.card .sum{color:var(--text2);font-size:14px;line-height:1.55;margin:0 0 12px;flex:1}.card .meta{margin:0}.card .row{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:10px}
.tile{min-height:0;text-decoration:none;color:var(--text)}a.tile:hover{color:var(--text)}
.tags{display:flex;flex-wrap:wrap;gap:6px}.tag{display:inline-flex;align-items:center;background:var(--hov);border:1px solid var(--line);color:var(--text2);border-radius:999px;padding:2px 10px;font-size:12px;font-weight:500;text-decoration:none;transition:border-color .15s,color .15s}.tag:hover{color:var(--text);border-color:var(--line2)}
.badge{--h:210;display:inline-flex;align-items:center;gap:6px;background:hsl(var(--h) 45% var(--bl));color:hsl(var(--h) 70% var(--bt));border:1px solid hsl(var(--h) 60% 50%/.18);border-radius:999px;padding:2px 10px 2px 2px;font-size:12px;font-weight:600;text-decoration:none}
.badge b{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:hsl(var(--h) 70% var(--bd));color:#fff;font-size:9px;letter-spacing:0}
.badge.gb{background:var(--on);color:var(--onx);border-color:var(--on)}.badge.gb b{background:var(--onx);color:var(--on)}
.meta{color:var(--mut);font-size:13px;font-variant-numeric:tabular-nums}
.btn,button.btn{display:inline-flex;align-items:center;gap:6px;background:var(--btn);color:#fff;border:1px solid transparent;border-radius:10px;padding:9px 16px;font-family:inherit;font-size:14px;font-weight:600;line-height:1.3;cursor:pointer;text-decoration:none;margin:4px 6px 4px 0;box-shadow:0 1px 0 rgba(255,255,255,.2) inset,0 6px 18px -8px var(--btn);transition:background .15s,transform .15s,box-shadow .15s}
.btn:hover{background:var(--btnh);color:#fff;transform:translateY(-1px)}.btn:active{transform:none}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}
.btn.ghost{background:var(--hov);color:var(--text);border-color:var(--line2);box-shadow:none}.btn.ghost:hover{background:var(--line);color:var(--text)}
/* detail */
.detail{max-width:760px;margin:0 auto;padding-top:20px}.detail.wide{max-width:1000px}
.detail h1{font-size:clamp(30px,5.6vw,46px);line-height:1.1;letter-spacing:-.035em;font-weight:700;margin:14px 0 14px}
.lead{font-size:clamp(17px,2.2vw,19px);color:var(--text2);line-height:1.6}
.detail ol,.detail ul{padding-left:22px}.detail li{margin:8px 0;color:var(--text2)}.detail li::marker{color:var(--mut)}
blockquote{margin:0;padding:16px 20px;border:1px solid var(--line);border-left:3px solid var(--acc2);background:var(--card);border-radius:4px 14px 14px 4px;white-space:pre-wrap;font-size:15.5px;color:var(--text2)}
pre,code{font-family:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace}
pre{white-space:pre-wrap;word-break:break-word;background:var(--bg2);border:1px solid var(--line);padding:16px;border-radius:12px;max-height:420px;overflow:auto;font-size:13px;line-height:1.65;color:var(--text2)}
.crumb{font-size:13px;color:var(--mut);margin:4px 0}.crumb a{color:var(--mut);text-decoration:none}.crumb a:hover{color:var(--text)}
.share{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:22px 0}
.sbtn{background:var(--hov);color:var(--text);border:1px solid var(--line);border-radius:999px;padding:6px 13px;font-family:inherit;font-size:13px;font-weight:500;line-height:1.3;text-decoration:none;cursor:pointer;transition:border-color .15s,background .15s}.sbtn:hover{border-color:var(--line2);background:var(--line);color:var(--text)}
.top10{padding-left:22px}.top10 li{margin:8px 0}
.tablewrap{overflow-x:auto;border:1px solid var(--line);border-radius:14px;background:var(--card)}table{border-collapse:collapse;width:100%}
td,th{border-bottom:1px solid var(--line);padding:11px 14px;text-align:left;font-size:14px;white-space:nowrap}th{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--mut);font-weight:600;background:var(--hov)}tr:last-child td{border-bottom:0}tr:hover td{background:var(--hov)}
/* sponsor */
.price{display:grid;grid-template-columns:1fr;gap:14px}@media(min-width:560px){.price{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}}
.price .amt{font-size:34px;font-weight:720;letter-spacing:-.03em;margin:6px 0}.price .best{border-color:color-mix(in srgb,var(--acc2) 55%,transparent);background:linear-gradient(180deg,color-mix(in srgb,var(--acc2) 12%,transparent),var(--card) 60%)}
.weeks{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}@media(min-width:560px){.weeks{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}}
.wk{padding:11px 12px;border-radius:11px;background:var(--card);border:1px solid var(--line);font-family:inherit;font-size:13px;font-weight:500;line-height:1.4;cursor:pointer;color:var(--text);text-align:left;transition:border-color .15s,background .15s}.wk:hover{border-color:var(--line2)}
.wk.sold{opacity:.4;text-decoration:line-through;cursor:not-allowed}.wk.sel{border-color:var(--acc2);background:color-mix(in srgb,var(--acc2) 14%,transparent);box-shadow:0 0 0 3px color-mix(in srgb,var(--acc2) 18%,transparent)}
form.sp{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:18px;box-shadow:var(--shadow)}
form.sp label{display:block;font-size:13.5px;font-weight:500;color:var(--text2);margin-bottom:14px}
form.sp input,form.sp select{display:block;width:100%;margin-top:6px;padding:11px 12px;background:var(--bg2);color:var(--text);border:1px solid var(--line2);border-radius:10px;font:inherit;font-size:16px;transition:border-color .15s,box-shadow .15s}
form.sp input:focus,form.sp select:focus,.news input:focus{outline:0;border-color:var(--acc2);box-shadow:0 0 0 3px color-mix(in srgb,var(--acc2) 22%,transparent)}
.news{position:relative;overflow:hidden;background:radial-gradient(80% 120% at 50% 0,var(--glow1),transparent 70%),var(--card);border:1px solid var(--line);border-radius:20px;padding:32px 20px;margin:40px 0;text-align:center}.news h2{margin-top:0}
.news form{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}.news input{padding:10px 14px;border-radius:10px;border:1px solid var(--line2);background:var(--bg);color:var(--text);min-width:0;flex:1 1 220px;max-width:320px;font:inherit;font-size:16px}
footer{border-top:1px solid var(--line);padding:32px 20px 40px;text-align:center;color:var(--mut);font-size:13.5px}footer b{color:var(--text)}footer a{color:var(--mut);text-decoration:none}footer a:hover{color:var(--text)}
.empty{padding:30px;text-align:center;color:var(--mut)}
@keyframes rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes pop{from{opacity:0;transform:translateY(-4px) scale(.98)}to{opacity:1;transform:none}}
.hero>*{animation:rise .6s cubic-bezier(.2,.8,.2,1) both}.hero>:nth-child(2){animation-delay:.06s}.hero>:nth-child(3){animation-delay:.12s}.hero>:nth-child(4){animation-delay:.18s}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-delay:0s!important;transition-duration:.01ms!important;scroll-behavior:auto!important}.card:hover,.btn:hover{transform:none}}
.h0{--h:0}.h1{--h:10}.h2{--h:20}.h3{--h:30}.h4{--h:40}.h5{--h:50}.h6{--h:60}.h7{--h:70}.h8{--h:80}.h9{--h:90}.h10{--h:100}.h11{--h:110}.h12{--h:120}.h13{--h:130}.h14{--h:140}.h15{--h:150}.h16{--h:160}.h17{--h:170}.h18{--h:180}.h19{--h:190}.h20{--h:200}.h21{--h:210}.h22{--h:220}.h23{--h:230}.h24{--h:240}.h25{--h:250}.h26{--h:260}.h27{--h:270}.h28{--h:280}.h29{--h:290}.h30{--h:300}.h31{--h:310}.h32{--h:320}.h33{--h:330}.h34{--h:340}.h35{--h:350}
.mh0{min-height:0}.wide{max-width:1000px}.unit{font-size:14px;font-weight:400}.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.tiles .tile{min-height:0;gap:2px}.tile h3{margin:14px 0 2px}.tile .sum{margin:8px 0 0;font-size:13.5px}
.tico{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:11px;padding:0;background:var(--hov);border:1px solid var(--line2);color:var(--acc);font-weight:700;font-size:16px}
.tico.badge b{width:100%;height:100%;border-radius:10px;font-size:13px}
/* agent logos */
.badge,.badge.gb{background:var(--hov);color:var(--text);border:1px solid var(--line2);padding:2px 10px 2px 2px}.badge:hover{border-color:var(--mut);color:var(--text)}
.lg{position:relative;display:inline-block;flex:0 0 auto;width:20px;height:20px;border-radius:50%;background:var(--card-s);box-shadow:0 0 0 1px var(--line2) inset;overflow:hidden}
.lg::before{content:"";position:absolute;inset:4px;background:var(--lgc,var(--text));-webkit-mask:var(--lgm,url(img/agents/generic.svg)) center/contain no-repeat;mask:var(--lgm,url(img/agents/generic.svg)) center/contain no-repeat}
.lg-claude-code{--lgm:url(img/agents/claude-code.svg);--lgc:#7fb8ff}
.lg-chatgpt-operator{--lgm:url(img/agents/chatgpt-operator.svg)}.lg-codex{--lgm:url(img/agents/codex.svg)}
.lg-cursor{--lgm:url(img/agents/cursor.svg)}.lg-langchain-langgraph{--lgm:url(img/agents/langchain-langgraph.svg)}
.lg-crewai{--lgm:url(img/agents/crewai.svg);--lgc:#7fb8ff}
.lg-grok-bot,.lg-browser-use{background:#050505 center/cover no-repeat}.lg-grok-bot::before,.lg-browser-use::before{content:none}
.lg-grok-bot{background-image:url(img/agents/grok-bot.png)}.lg-browser-use{background-image:url(img/agents/browser-use.png)}
.tico{background:var(--card-s)}.tico .lg{width:100%;height:100%;border-radius:10px;box-shadow:none;background-color:transparent}.tico .lg::before{inset:9px}
.tico .lg-grok-bot,.tico .lg-browser-use{background-color:#050505}
/* daily AI news */
.today{margin:36px 0 8px;padding:20px 16px;border:1px solid var(--line);border-radius:20px;background:radial-gradient(70% 90% at 0 0,var(--glow1),transparent 60%),var(--card)}@media(min-width:640px){.today{padding:26px}}
.today-head{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:16px}.today-head h2{margin:0;display:flex;align-items:center;gap:10px;flex-wrap:wrap}.today-head .btn{margin:0}
.live{width:9px;height:9px;border-radius:50%;background:#34d399;box-shadow:0 0 0 0 rgba(52,211,153,.6);animation:pulse 2.2s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 8px rgba(52,211,153,0)}100%{box-shadow:0 0 0 0 rgba(52,211,153,0)}}
.news-grid{gap:12px}.ncard{min-height:0}.ncard h3{font-size:16px}.ncard .nsrc{color:var(--text);font-weight:600}.ncard .ext{color:var(--acc)}.ncard .tag{font-size:11.5px}
.today>.meta{margin:14px 0 0}.nday{display:flex;align-items:baseline;gap:10px;margin:36px 0 14px}.nday:first-of-type{margin-top:28px}

/* ux restructure */
.hero{padding:28px 0 4px}
@media(min-width:900px){.hero{padding:64px 0 12px}}
.hero h1 em{font-style:normal;color:var(--acc)}
#start{margin-top:18px}
#start h2,#tasks-h{margin-top:28px}
.scard .sum{flex:0 0 auto}
.scard .meta{margin:2px 0}
.scard .meta b,.scard .sum b{color:var(--text)}
.ev{display:inline-flex;align-items:center;border-radius:999px;padding:2px 10px;font-size:12px;font-weight:600;border:1px solid var(--line2);color:var(--text2);background:var(--hov)}
.ev-detailed-write-up,.ev-open-source-code{color:#34d399;border-color:rgba(52,211,153,.4)}
.ev-self-reported{color:#a5b4fc;border-color:rgba(165,180,252,.4)}
.ev-second-hand-report,.ev-unverified,.ev-product-launch{color:#b8d42e;border-color:rgba(184,212,46,.4)}
[data-theme=light] .ev-detailed-write-up,[data-theme=light] .ev-open-source-code{color:#047857}
[data-theme=light] .ev-self-reported{color:#4338ca}
[data-theme=light] .ev-second-hand-report,[data-theme=light] .ev-unverified,[data-theme=light] .ev-product-launch{color:#3f5800}
.tasks{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
@media(min-width:700px){.tasks{grid-template-columns:repeat(4,1fr)}}
.task{display:flex;flex-direction:column;gap:4px;padding:14px;border:1px solid var(--line);border-radius:14px;background:var(--card);color:var(--text);text-decoration:none;transition:border-color .15s}
.task:hover{border-color:var(--line2);color:var(--text)}
.task .tico{font-size:20px}
.filters{margin:14px 0 0}
.filters>summary{list-style:none;cursor:pointer}
.filters>summary::-webkit-details-marker{display:none}
.filters .chips{flex-wrap:wrap;overflow:visible}
.bar .barr{display:flex;gap:10px;align-items:center}
.play{margin:22px 0;padding:18px 20px;border:1px solid var(--line2);border-radius:16px;background:var(--card)}
.play h2{margin-top:0}
.play h3{font-size:15px;text-transform:uppercase;letter-spacing:.05em;color:var(--mut);margin:18px 0 6px}
.play pre.prompt{margin:6px 0 10px}
.warn{padding:10px 14px;border-radius:12px;border:1px solid rgba(184,212,46,.45);background:rgba(184,212,46,.08);color:var(--text2)}
.verify ul{padding-left:20px;color:var(--text2)}
.verify li{margin:8px 0}
.disc{color:var(--mut);font-size:13.5px}
.row.center{justify-content:center;display:flex;gap:10px;flex-wrap:wrap}
/* directory */
#dq{display:block;width:100%;max-width:560px;margin:8px 0 4px;padding:12px 14px;border-radius:12px;border:1px solid var(--line2);background:var(--bg2);color:var(--text);font:inherit}
.dchips{flex-wrap:wrap;overflow:visible}
.dcard[hidden]{display:none}
.dhead{display:flex;align-items:center;gap:12px}
.dhead h3{margin:0}
.price{font-weight:600;font-size:12.5px}
.p-free{color:#34d399}.p-freemium{color:#a5b4fc}.p-paid{color:#b8d42e}
[data-theme=light] .p-free{color:#047857}[data-theme=light] .p-freemium{color:#4338ca}[data-theme=light] .p-paid{color:#3f5800}
.dcard .ext{color:var(--acc)}
.streak{font-size:.85rem;opacity:.75;margin-left:auto;margin-right:.5rem;white-space:nowrap}
.potd .prompt{max-height:14rem;overflow:auto;white-space:pre-wrap}
details.free{margin-top:.5rem}details.free summary{cursor:pointer;list-style:none}details.free summary::-webkit-details-marker{display:none}
.fbadge{display:inline-block;font-size:.75rem;font-weight:600;padding:.15rem .5rem;border-radius:999px;background:rgba(34,197,94,.15);color:#4ade80;border:1px solid rgba(34,197,94,.4)}
[data-theme=light] .fbadge{color:#15803d}
details.free p{font-size:.9rem;margin:.4rem 0}
.finder fieldset{border:0;padding:0;margin:0 0 1.2rem}.finder legend{font-weight:700;margin-bottom:.5rem}
.chip.opt{cursor:pointer}.chip.opt input{margin-right:.3rem}.chip.opt:has(input:checked){outline:2px solid #6366f1}
table.battle{width:100%;border-collapse:collapse}table.battle th,table.battle td{padding:.6rem;border-bottom:1px solid rgba(127,127,127,.25);text-align:left;vertical-align:top}
.tablewrap{overflow-x:auto}
@media(max-width:600px){table.battle{font-size:.85rem}.streak{font-size:.75rem}}
.finder .chips{flex-wrap:wrap;overflow:visible;white-space:normal}.finder .chip.opt{white-space:normal;flex:0 1 auto;max-width:100%}
details.free{position:relative;z-index:2}
/* round 3: deals, safety, guides, prompt library */
.tag.tpl{border-color:rgba(165,180,252,.5);color:#a5b4fc}.tag.realp{border-color:rgba(34,197,94,.45);color:#4ade80}[data-theme=light] .tag.tpl{color:#4338ca}[data-theme=light] .tag.realp{color:#15803d}
.deal .offer{font-weight:600;color:var(--text);margin:.35rem 0}.deal .exp{color:#b8d42e;font-weight:600}[data-theme=light] .deal .exp{color:#3f5800}
.alert h3{margin-top:.2rem}.alert h4{margin:.8rem 0 .2rem;font-size:.95rem}.alert ul{margin:.2rem 0;padding-left:1.2rem}.alert li{margin:.15rem 0}
.check{list-style:none;padding:0}.check li{padding:.4rem 0 .4rem 1.8rem;position:relative;border-bottom:1px solid var(--line)}.check li::before{content:"✓";position:absolute;left:.3rem;color:#4ade80;font-weight:700}
.teasers{margin:36px 0 8px}.teasers .card h3{margin-top:.2rem}
.rprompt{margin:.6rem 0 1rem}.rprompt pre.prompt{white-space:pre-wrap;word-break:break-word;margin:.3rem 0}
pre.prompt{white-space:pre-wrap;word-break:break-word}
.gsteps li{margin:.35rem 0}
.deal[hidden]{display:none}
.mailfb{color:var(--mut);font-size:13px;white-space:nowrap}.mailfb .addr{user-select:all;color:var(--text2)}
button.copyaddr{background:var(--hov);color:var(--text);border:1px solid var(--line2);border-radius:6px;padding:1px 7px;font-family:inherit;font-size:12px;font-weight:600;line-height:1.4;cursor:pointer;margin-left:4px}button.copyaddr:hover{background:var(--line)}
form.sp textarea{display:block;width:100%;margin-top:6px;padding:11px 12px;background:var(--bg2);color:var(--text);border:1px solid var(--line2);border-radius:10px;font:inherit;font-size:16px;min-height:110px}
form.sp label{display:block;margin:12px 0}form.sp .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.fstatus{margin-top:10px;font-size:14px}.fstatus.ok{color:#22c55e}.fstatus.err{color:#7fb8ff}

/* homepage: hero status, daily tools strip, share on X */
.status{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;margin:10px 0 0;font-size:.9rem;color:var(--muted,inherit)}.status .xfollow{padding:4px 12px;font-size:.85rem}
.daily{margin:36px 0 8px}.dstrip{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.dt{padding:14px}.dt h3{font-size:1rem;margin:.3rem 0}.dt ul{margin:.3rem 0;padding-left:1.1rem;font-size:.88rem}.dt .prompt{max-height:5.5rem;overflow:auto;font-size:.8rem;white-space:pre-wrap}
.dt.sponsored{border-style:dashed}.tag.spon{font-weight:700;text-transform:uppercase;letter-spacing:.04em}
@media(max-width:640px){.dstrip{grid-auto-flow:column;grid-auto-columns:78%;grid-template-columns:none;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px}.dt{scroll-snap-align:start}}
.xshare{font-size:.85rem}
/* homepage: see-all + AI Battle Simulator banner */
.seeall{margin-top:14px;justify-content:center}
.battle{margin:40px 0;border-radius:20px;overflow:hidden;position:relative;color:#f5f5f7;background:radial-gradient(120% 140% at 0% 0%,rgba(127,184,255,.35),transparent 55%),radial-gradient(120% 140% at 100% 100%,rgba(99,102,241,.4),transparent 55%),linear-gradient(135deg,#0a0507,#120a1c 60%,#05060c);border:1px solid rgba(255,255,255,.1);box-shadow:0 20px 60px -25px rgba(127,184,255,.45)}
.bt-in{display:grid;grid-template-columns:1.1fr .9fr;gap:28px;align-items:center;padding:34px 36px}
.bt-in>*{min-width:0}
.bt-kick{margin:0 0 6px;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#7fb8ff}
.battle h2{margin:0 0 8px;font-size:clamp(28px,4.2vw,44px);line-height:1.05;letter-spacing:-.03em;font-weight:800;color:#fff;text-shadow:0 2px 24px rgba(127,184,255,.45)}
.bt-pitch{margin:0 0 16px;color:#d4d4dc;font-size:16.5px}
.bt-chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:10px}
.bt-chip{display:inline-block;padding:7px 12px;border-radius:999px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);color:#fff;text-decoration:none;font-size:13.5px;font-weight:600;transition:background .15s,border-color .15s}
.bt-chip i{font-style:normal;color:#7fb8ff;font-weight:800;margin:0 2px}
.bt-chip:hover{background:rgba(127,184,255,.22);border-color:rgba(127,184,255,.6);color:#fff}
.btn.bt-go{background:linear-gradient(135deg,#7fb8ff,#2f6fa8);box-shadow:0 8px 24px -8px rgba(127,184,255,.8);font-size:15.5px;padding:11px 22px}
.btn.bt-go:hover{background:linear-gradient(135deg,#7fb8ff,#7fb8ff)}
.bt-note{margin:6px 0 0;font-size:12.5px;color:#9ca3af}
.bt-img{width:100%;border-radius:14px;border:1px solid rgba(255,255,255,.12);box-shadow:0 12px 40px -12px rgba(0,0,0,.8);display:block}
@media(max-width:760px){.bt-in{grid-template-columns:1fr;padding:24px 18px;gap:18px}.bt-img{order:-1}.bt-chip{font-size:13px}}
@media(min-width:900px) and (max-width:1180px){.dnav a{padding:7px 8px}}
/* ---- trust: editor box, evidence list, sponsor slots, 404 ---- */
.ebox{display:flex;gap:14px;align-items:flex-start;border:1px solid var(--line,#2a2f3a);border-radius:14px;padding:14px 16px;margin:12px 0}
.ebox p{margin:.2em 0}.eav{flex:0 0 44px;height:44px;border-radius:50%;display:grid;place-items:center;background:#6366f1;color:#fff;font-weight:700}
.ebox.mini{margin:24px 0;font-size:.92em}.ebox.mini .eav{flex-basis:34px;height:34px;font-size:.85em}
.evdl dt{margin-top:12px}.evdl dd{margin:4px 0 0 0}
.sgrid .amt{font-size:1.6em;font-weight:700;margin:.3em 0}.sgrid .card.best{outline:2px solid #6366f1}
.lastchk{margin-top:10px}
.nf{text-align:center}.nf-code{font-size:4.5rem;font-weight:800;margin:.2em 0 0;opacity:.35}.nf-links{list-style:none;padding:0;line-height:2}
/* tools directory + compare */
.vbadge{display:inline-block;font-size:.75rem;font-weight:600;padding:.12rem .5rem;border-radius:999px;border:1px solid;white-space:nowrap}
.v-free{color:#4ade80;border-color:rgba(34,197,94,.45);background:rgba(34,197,94,.12)}.v-tier{color:#a5b4fc;border-color:rgba(99,102,241,.45);background:rgba(99,102,241,.12)}
.v-trial{color:#b8d42e;border-color:rgba(184,212,46,.45);background:rgba(184,212,46,.1)}.v-paid{color:#7fb8ff;border-color:rgba(127,184,255,.45);background:rgba(127,184,255,.1)}.v-check{color:#cbd5e1;border-color:rgba(148,163,184,.45);background:rgba(148,163,184,.1)}
[data-theme=light] .v-free{color:#047857}[data-theme=light] .v-tier{color:#4338ca}[data-theme=light] .v-trial{color:#3f5800}[data-theme=light] .v-paid{color:#2f6fa8}[data-theme=light] .v-check{color:#334155}
.tcard[hidden]{display:none}.tchips{flex-wrap:wrap;overflow:visible}.vlegend .vbadge{margin:2px 0}
.freebox{border:1px solid var(--line);border-radius:14px;padding:4px 16px 8px;background:var(--card);margin:16px 0}.freebox h2{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.bfgrid{display:grid;grid-template-columns:1fr;gap:4px 24px}@media(min-width:700px){.bfgrid{grid-template-columns:1fr 1fr}}
table.cmp th[scope=row]{width:22%;font-weight:600}table.cmp td,table.cmp th{min-width:120px}
.verdicts li{margin:.35rem 0}
ul.tools a{color:var(--acc)}
#tq{display:block;width:100%;max-width:560px;margin:8px 0 4px;padding:12px 14px;border-radius:12px;border:1px solid var(--line2);background:var(--bg2);color:var(--text);font:inherit}

.callout{border:1px solid var(--accent,#7c5cff);border-radius:12px;padding:12px 16px;margin:12px 0;background:rgba(124,92,255,.08)}
s.was{opacity:.6;font-weight:400;margin-right:4px}
/* section heading icons */
.hico{display:inline-flex;align-items:center;justify-content:center;flex:none;width:1.45em;height:1.45em;margin-right:.45em;vertical-align:-.32em;border-radius:.42em;color:var(--acc);background:linear-gradient(135deg,rgba(129,140,248,.26),rgba(45,212,191,.12));border:1px solid rgba(165,180,252,.22);box-shadow:0 1px 0 rgba(255,255,255,.06) inset,0 4px 14px -6px var(--glow1)}
.hico svg{width:62%;height:62%;display:block}
[data-theme=light] .hico{background:linear-gradient(135deg,rgba(99,102,241,.14),rgba(45,212,191,.10));border-color:rgba(79,70,229,.18)}
.today-head h2 .hico{margin-right:0}
h1 .hico{width:1.25em;height:1.25em;vertical-align:-.22em;border-radius:.34em}
@media (max-width:520px){.hico{width:1.35em;height:1.35em;margin-right:.38em}}
.bico{width:1.25em;height:1.25em;margin-right:.4em;vertical-align:-.25em;color:inherit;background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.22);box-shadow:none}
h3 .hico{width:1.4em;height:1.4em;vertical-align:-.3em;margin-right:.4em}
/* ---------- topic panels: each homepage section gets its own colour fade (hue via --th) ---------- */
#start{--th:184,212,46}#daily{--th:34,211,238}section[aria-labelledby=tasks-h]{--th:217,70,239}section[aria-labelledby=copy-h]{--th:139,92,246}#plays{--th:127,184,255}#weekly{--th:59,130,246}#verify{--th:132,204,22}#protect{--th:184,212,46}.movers{--th:16,185,129}
#start,#daily,section[aria-labelledby=tasks-h],section[aria-labelledby=copy-h],#plays,#weekly,#verify,#protect,.movers{position:relative;margin:36px 0 8px;padding:20px 16px;border-radius:20px;border:1px solid rgba(var(--th),.22);background:radial-gradient(75% 95% at 0 0,rgba(var(--th),.24),transparent 62%),radial-gradient(60% 80% at 100% 100%,rgba(var(--th),.08),transparent 70%),var(--card);box-shadow:0 18px 50px -30px rgba(var(--th),.55)}
@media(min-width:640px){#start,#daily,section[aria-labelledby=tasks-h],section[aria-labelledby=copy-h],#plays,#weekly,#verify,#protect,.movers{padding:26px}}
#weekly{margin:40px 0;padding:32px 20px}
:is(#start,#daily,section[aria-labelledby=tasks-h],section[aria-labelledby=copy-h],#plays,#weekly,#verify,#protect,.movers) h2 .hico{color:rgb(var(--th));background:linear-gradient(135deg,rgba(var(--th),.32),rgba(var(--th),.10));border-color:rgba(var(--th),.35);box-shadow:0 1px 0 rgba(255,255,255,.06) inset,0 4px 14px -6px rgba(var(--th),.6)}
[data-theme=light] :is(#start,#daily,section[aria-labelledby=tasks-h],section[aria-labelledby=copy-h],#plays,#weekly,#verify,#protect,.movers){border-color:rgba(var(--th),.28);background:radial-gradient(75% 95% at 0 0,rgba(var(--th),.16),transparent 62%),radial-gradient(60% 80% at 100% 100%,rgba(var(--th),.06),transparent 70%),var(--card-s);box-shadow:0 14px 36px -26px rgba(var(--th),.5)}
[data-theme=light] :is(#start,#daily,section[aria-labelledby=tasks-h],section[aria-labelledby=copy-h],#plays,#weekly,#verify,#protect,.movers) h2 .hico{color:color-mix(in srgb,rgb(var(--th)) 70%,#000);background:linear-gradient(135deg,rgba(var(--th),.20),rgba(var(--th),.06))}
/* tool brand logos (tools/, compare/): Simple Icons glyph or local favicon in a dark tile */
.tlogo{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;width:1.6em;height:1.6em;margin-right:.45em;vertical-align:-.42em;border-radius:.4em;background:#15171f;box-shadow:0 0 0 1px var(--line2,rgba(255,255,255,.12)) inset;overflow:hidden}
.tlogo svg{width:62%;height:62%;display:block}.tl-gen{color:var(--muted,#9aa3b2)}
.tlogo.tl-img{background:transparent}.tlogo img{width:100%;height:100%;display:block;object-fit:contain}
.tlogo.lg1{width:1.3em;height:1.3em;vertical-align:-.2em;border-radius:.3em}
.tlpair{display:inline-flex;margin-right:.1em}.tlpair .tlogo{margin-right:.2em}
table.cmp thead .tlogo{width:1.4em;height:1.4em;vertical-align:-.38em}
.tlogo.dlg{width:40px;height:40px;margin:0;border-radius:11px;vertical-align:middle}.tlogo.dlg.tl-img{border-radius:11px}
/* ================= 2026 redesign layer: calm density, 8px rhythm, bento news ================= */
:root{--r-sm:10px;--r:16px;--r-lg:22px;--s1:8px;--s2:16px;--s3:24px;--s4:32px;--s5:48px;--s6:72px;--ease:cubic-bezier(.2,.8,.2,1)}
body{font-size:16px;line-height:1.6}
h2{font-size:clamp(22px,3vw,28px);line-height:1.2;letter-spacing:-.03em;font-weight:680;margin:var(--s5) 0 var(--s2)}
.detail h1{font-size:clamp(34px,5.4vw,52px);letter-spacing:-.04em;line-height:1.05}
.lead{max-width:680px;color:var(--mut)}
.wrap{padding-bottom:var(--s6)}
/* nav */
.top{padding-top:12px;padding-bottom:12px;border-bottom-color:transparent;box-shadow:0 1px 0 var(--line)}
.dnav a{font-size:13.5px;padding:6px 11px;border-radius:999px}
.dnav a:hover{background:var(--hov)}
/* buttons */
.btn,button.btn{border-radius:999px;padding:9px 18px;font-weight:600;letter-spacing:-.01em;transition:background .2s,transform .2s var(--ease),box-shadow .2s,border-color .2s}
.btn.ghost{background:transparent;border-color:var(--line2)}.btn.ghost:hover{background:var(--hov);border-color:color-mix(in srgb,var(--text) 30%,transparent)}
.btn:focus-visible,.card a:focus-visible,.chip:focus-visible{outline:2px solid var(--acc);outline-offset:3px}
/* card system */
.grid{gap:var(--s2)}@media(min-width:640px){.grid{gap:20px}}
.card{border-radius:var(--r);padding:var(--s3);transition:border-color .25s,transform .3s var(--ease),box-shadow .3s var(--ease),background .25s}
.card:hover{transform:translateY(-3px);border-color:var(--line2);box-shadow:var(--shadow),0 18px 40px -24px rgba(0,0,0,.7)}
.card h3{margin:14px 0 8px;font-size:17px;line-height:1.3}
.card .sum{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;overflow:hidden;color:var(--mut);line-height:1.55}
.tag{font-size:11.5px;letter-spacing:.01em;padding:3px 10px}
/* section headers */
.today-head{margin-bottom:var(--s3);align-items:flex-end}.today-head h2{font-size:clamp(22px,3vw,28px)}
.today-head h2 .meta{font-size:13px;font-weight:500;letter-spacing:0}
/* ---------- news cards (homepage Today in AI + /news.html) ---------- */
#today{--th:56,189,248;position:relative;margin:var(--s5) 0 var(--s1);padding:var(--s3) var(--s2);border-radius:var(--r-lg);border:1px solid rgba(var(--th),.22);background:radial-gradient(75% 95% at 0 0,rgba(var(--th),.20),transparent 62%),radial-gradient(60% 80% at 100% 100%,rgba(var(--th),.07),transparent 70%),var(--card)}
@media(min-width:640px){#today{padding:var(--s4)}}
[data-theme=light] #today{background:radial-gradient(75% 95% at 0 0,rgba(var(--th),.14),transparent 62%),var(--card-s)}
#today>.meta{margin:var(--s3) 0 0}
.news-grid{gap:var(--s2)}
@media(min-width:640px){.news-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}}
@media(min-width:1000px){.news-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.ncard{padding:22px 24px;gap:0;min-height:0}
.ncard .tags{gap:0}.ncard .tag{background:rgba(var(--th,165,180,252),.12);border-color:rgba(var(--th,165,180,252),.28);color:var(--text);font-weight:600;font-size:11px;text-transform:uppercase;letter-spacing:.06em;padding:3px 9px}
.ncard h3{font-size:18px;line-height:1.3;letter-spacing:-.02em;margin:14px 0 10px;font-weight:650}
.ncard .sum{-webkit-line-clamp:3;line-clamp:3;font-size:14.5px;margin:0 0 18px}
.ncard .nfoot{display:flex;align-items:center;gap:10px;margin-top:auto;padding-top:14px;border-top:1px solid var(--line);font-size:12.5px}
.ncard .nfoot .nsrc{color:var(--text2);font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.ncard .nfoot time{color:var(--mut)}.ncard .nfoot .dot{color:var(--line2);white-space:pre}
.ncard .ext{margin-left:auto;color:var(--mut);transition:transform .25s var(--ease),color .2s}
.ncard:hover .ext{color:var(--acc);transform:translate(2px,-2px)}
.ncard h3 a:hover{color:var(--text)}.ncard:hover h3 a{color:var(--acc)}
/* news page day headers */
.nday{display:flex;align-items:baseline;gap:12px;margin:var(--s5) 0 var(--s2);padding-bottom:12px;border-bottom:1px solid var(--line);font-size:clamp(20px,2.6vw,24px)}
.nday .meta{font-size:13px;font-weight:500}
.detail.wide{max-width:1180px}
/* footer */
footer{padding:var(--s5) 20px var(--s5);line-height:2;margin-top:var(--s5)}footer p{max-width:900px;margin:0 auto 6px}footer a{padding:0 2px}

.news-grid{align-items:stretch}.ncard{height:100%}
.ncard .sum{flex:0 0 auto;max-height:calc(1.55em * 3)}
/* ---------- v3: news card visual headers (16:9, self-hosted og:image or branded fallback) ---------- */
.ncard{padding:0;overflow:hidden}
.ncard .nbody{display:flex;flex-direction:column;flex:1;padding:18px 22px 20px}
.ncard h3{margin:12px 0 8px}
.nimg{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--bg2);border-bottom:1px solid var(--line)}
.nimg img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease),filter .3s}
.nimg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(8,9,12,.35));pointer-events:none}
.ncard:hover .nimg img{transform:scale(1.04)}
.nfb{display:grid;place-items:center;align-content:center;gap:10px;background:radial-gradient(90% 120% at 15% 0,hsl(var(--h) 70% 55%/.45),transparent 60%),radial-gradient(70% 90% at 100% 100%,hsl(calc(var(--h) + 40) 70% 50%/.30),transparent 65%),linear-gradient(135deg,hsl(var(--h) 35% 12%),#0a0b10)}
.nfb::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:28px 28px;-webkit-mask:radial-gradient(70% 70% at 50% 45%,#000,transparent);mask:radial-gradient(70% 70% at 50% 45%,#000,transparent)}
.nmark{position:relative;display:grid;place-items:center;width:64px;height:64px;border-radius:18px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);box-shadow:0 1px 0 rgba(255,255,255,.15) inset,0 12px 30px -10px hsl(var(--h) 80% 40%/.8);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:transform .4s var(--ease)}
.nmark img{width:40px;height:40px;border-radius:10px;object-fit:contain}
.nmark b{font-size:28px;font-weight:750;letter-spacing:-.04em;color:#fff}
.nfbsrc{position:relative;font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.72)}
.ncard:hover .nmark{transform:translateY(-2px) scale(1.04)}
[data-theme=light] .nimg::after{background:none}
/* ---------- QA pass: homepage rhythm, full rows, heading icon spacing ---------- */
/* consistent generous gap between every homepage section */
main.wrap>section,main.wrap>.battle,main.wrap>.today,main.wrap>.daily,main.wrap>.news{margin-top:64px!important;margin-bottom:0!important}
main.wrap>.hero+section,main.wrap>.hero+*{margin-top:48px!important}
@media(max-width:639px){main.wrap>section,main.wrap>.battle,main.wrap>.today,main.wrap>.daily,main.wrap>.news{margin-top:40px!important}main.wrap>.hero+*{margin-top:32px!important}}
/* daily tools: 5 cards → 3 + 2 full rows on desktop instead of 4 + orphan */
@media(min-width:1000px){.dstrip:has(>:nth-child(5):last-child){grid-template-columns:repeat(6,minmax(0,1fr))}.dstrip:has(>:nth-child(5):last-child)>*{grid-column:span 2}.dstrip:has(>:nth-child(5):last-child)>:nth-child(n+4){grid-column:span 3}}
@media(min-width:641px) and (max-width:999px){.dstrip{grid-template-columns:repeat(2,minmax(0,1fr))}.dstrip>:last-child:nth-child(odd){grid-column:1/-1}}
/* section heading icons: real gap instead of inline margin */
h2:has(>.hico){display:flex;align-items:center;flex-wrap:wrap;column-gap:14px;row-gap:6px}
h2>.hico{margin-right:0!important;vertical-align:0}
@media(max-width:520px){h2:has(>.hico){column-gap:11px}}


/* ---------- Today's Drop (distinct teal; archive by date in data/drops.json) ---------- */
#drop{--th:45,212,191;position:relative;margin:var(--s5) 0 var(--s1);padding:var(--s3) var(--s2);border-radius:var(--r-lg);border:1px solid rgba(var(--th),.22);background:radial-gradient(75% 95% at 0 0,rgba(var(--th),.22),transparent 62%),radial-gradient(60% 80% at 100% 100%,rgba(var(--th),.08),transparent 70%),var(--card);box-shadow:0 18px 50px -30px rgba(var(--th),.55)}
@media(min-width:640px){#drop{padding:var(--s4)}}
[data-theme=light] #drop{background:radial-gradient(75% 95% at 0 0,rgba(var(--th),.14),transparent 62%),var(--card-s)}
#drop h2 .hico{color:rgb(var(--th));background:linear-gradient(135deg,rgba(var(--th),.32),rgba(var(--th),.10));border-color:rgba(var(--th),.35)}
.drop-blurb{margin:0 0 14px;max-width:62ch}
.drop-grid{gap:12px;align-items:stretch}
@media(min-width:640px){.drop-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}}
@media(min-width:1000px){.drop-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.dcard-drop{min-height:200px;height:100%}
.dcard-drop .tag.orig{background:rgba(45,212,191,.18);border-color:rgba(45,212,191,.45);color:rgb(45,212,191);font-weight:600}
main.wrap>.drop{margin-top:64px!important;margin-bottom:0!important}
@media(max-width:639px){main.wrap>.drop{margin-top:40px!important}}
/* ---------- merged Today in AI: type label on the image header ---------- */
.ncard{position:relative}
.nkind{position:absolute;top:12px;left:12px;z-index:2;padding:4px 9px;border-radius:999px;font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#fff;background:rgba(8,9,12,.62);border:1px solid rgba(255,255,255,.18);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.nkind.k-tool{background:rgba(16,120,90,.78)}.nkind.k-use-case{background:rgba(127,184,255,.78)}.nkind.k-setup{background:rgba(37,99,235,.78)}.nkind.k-original{background:rgba(124,58,237,.8)}.nkind.k-essay{background:rgba(63,88,0,.8)}
/* ---------- news grids: no orphan cards for any count ---------- */
@media(min-width:1000px){
 .news-grid{grid-template-columns:repeat(6,minmax(0,1fr))}.news-grid>.ncard{grid-column:span 2}
 .news-grid>.ncard:nth-child(3n+1):nth-last-child(2),.news-grid>.ncard:nth-child(3n+1):nth-last-child(2)+.ncard{grid-column:span 3}
 .news-grid>.ncard:nth-child(3n+1):last-child{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr)}
 .news-grid>.ncard:nth-child(3n+1):last-child .nimg{height:100%;aspect-ratio:auto;min-height:260px;border-bottom:0;border-right:1px solid var(--line)}
 .news-grid>.ncard:nth-child(3n+1):last-child .nbody{padding:28px 32px;justify-content:center}
 .news-grid>.ncard:nth-child(3n+1):last-child h3{font-size:22px}
}
@media(min-width:640px) and (max-width:999px){
 .news-grid>.ncard:nth-child(odd):last-child{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
 .news-grid>.ncard:nth-child(odd):last-child .nimg{height:100%;aspect-ratio:auto;min-height:220px;border-bottom:0;border-right:1px solid var(--line)}
}
/* ---------- slim Weekly 5 bar under Today in AI ---------- */
main.wrap>.wkbar{margin-top:28px!important}
.wkbar{--th:59,130,246;border:1px solid rgba(var(--th),.25);border-radius:16px;background:linear-gradient(90deg,rgba(var(--th),.16),rgba(var(--th),.04) 60%),var(--card);padding:14px 18px}
.wkbar-in{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.wkbar-t{margin:0;flex:1 1 300px;color:var(--text2);font-size:14.5px}.wkbar-t b{color:var(--text);margin-right:8px}
.wkbar-f{display:flex;gap:8px;flex:1 1 340px;max-width:460px;flex-wrap:wrap;margin:0}
.wkbar-f input[type=email]{flex:1 1 200px;min-width:0;padding:10px 14px;border-radius:999px;border:1px solid var(--line2);background:var(--bg);color:var(--text);font:inherit;font-size:16px}
.wkbar-f .btn{margin:0}.wkbar-f .fstatus{flex-basis:100%;margin:0;font-size:13px}.wkbar-f .fstatus:empty{display:none}
@media(max-width:639px){main.wrap>.wkbar{margin-top:24px!important}.wkbar{padding:14px}.wkbar-f{max-width:none}}
.nkind.k-play{background:rgba(37,99,235,.78)}.nkind.k-news{background:rgba(8,9,12,.62)}
.nuse{margin:8px 0 0;font-size:13.5px;line-height:1.45;color:var(--ink,inherit);padding:8px 10px;border-left:3px solid var(--acc,#6d5cff);background:var(--bg2);border-radius:6px}
.nuse b{font-weight:700}
.today .seeall{margin:16px 0 4px}
.nkind.k-agent-setup{background:rgba(37,99,235,.78)}
.nimg.nog{background:#0b0d14}.nimg.nog img{object-fit:contain}.ncard:hover .nimg.nog img{transform:none}.nimg.nog+.nkind{left:auto;right:12px}
/* ---- AI model prices (/models/) + homepage New models strip ---- */
.mlogo{flex:none;display:inline-grid;place-items:center;width:44px;height:44px;border-radius:12px;background:#fff;border:1px solid var(--line2);padding:7px}.mlogo img{display:block;width:100%;height:100%}
.newmodels{margin:36px 0 8px;padding:20px 16px;border:1px solid var(--line);border-radius:20px;background:var(--card)}@media(min-width:640px){.newmodels{padding:26px}}
.mstrip{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}
@media(max-width:640px){.mstrip{grid-auto-flow:column;grid-auto-columns:72%;grid-template-columns:none;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px}.mcard{scroll-snap-align:start}}
.mcard{display:flex;gap:12px;align-items:flex-start;padding:14px;min-height:0}.mcard h3{font-size:16px;margin:0 0 2px;line-height:1.3}.mcard p{margin:2px 0}.mcb{min-width:0}
.mprice{font-size:14px;color:var(--text2)}.mprice b{color:var(--text)}
.models .mkey{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.kin,.kout{display:inline-block;width:14px;height:10px;border-radius:3px;background:var(--acc2)}.kout{background:#2dd4bf;margin-left:10px}
.mchart{display:grid;gap:10px;margin-bottom:8px}
.mrow{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px 12px;align-items:center;padding:12px 14px;border:1px solid var(--line);border-radius:14px;background:var(--card)}
.mrow .mlogo{width:38px;height:38px;padding:6px}.mname{display:flex;flex-direction:column;line-height:1.3}.mname .meta{font-size:13px}
.mbars{grid-column:1/-1;display:grid;gap:4px}@media(min-width:760px){.mrow{grid-template-columns:auto minmax(170px,240px) minmax(0,1fr)}.mbars{grid-column:auto}}
.mb{display:grid;grid-template-columns:30px minmax(0,1fr) 62px;align-items:center;gap:8px;font-size:13px}.mlab{color:var(--mut)}.mval{text-align:right;font-variant-numeric:tabular-nums;font-weight:600}
.mbar{display:block;width:100%;height:12px;border-radius:4px;background:var(--bg2)}.mbar.bin rect{fill:var(--acc2)}.mbar.bout rect{fill:#2dd4bf}
.mintro{font-size:12.5px;color:#b8d42e}
table.mtable{font-size:14px}table.mtable th,table.mtable td{padding:10px 12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}table.mtable thead th{font-size:12.5px;color:var(--mut);font-weight:600;white-space:nowrap}
table.mtable td.num{font-variant-numeric:tabular-nums;white-space:nowrap;font-weight:600}table.mtable .mnote{min-width:240px;color:var(--text2)}table.mtable .msrc{min-width:170px;font-size:13px}
.mcell{display:flex;gap:10px;align-items:flex-start;min-width:180px}.mcell .mlogo{width:30px;height:30px;padding:5px;border-radius:8px}.mcell code{font-size:12px;color:var(--mut)}
/* a11y: always-visible keyboard focus (inputs keep their ring but also get a solid outline); readable intro-price note in light theme */
a:focus-visible,button:focus-visible,summary:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--acc2);outline-offset:2px}
#q:focus-visible,form.sp input:focus-visible,form.sp select:focus-visible,form.sp textarea:focus-visible,.news input:focus-visible,.wkbar-f input:focus-visible{outline:2px solid var(--acc2);outline-offset:1px}
[data-theme=light] .mintro{color:#3f5800}
.mstrip:focus-visible{outline:3px solid var(--acc2)}
table.mtable tbody th{text-transform:none;letter-spacing:0;font-size:14px;color:var(--text);font-weight:400}table.mtable tbody th b{font-weight:650}
table.mtable .mnote{min-width:200px}table.mtable .msrc{min-width:150px;overflow-wrap:anywhere}.mcell{min-width:160px}
@media(min-width:1000px){table.mtable{font-size:13.5px}table.mtable th,table.mtable td{padding:10px 9px}}
table.mtable td.mnote,table.mtable td.msrc,table.mtable td{white-space:normal}table.mtable td.num{white-space:nowrap}table.mtable .mnote{max-width:300px}
/* ---- AI Tool Finder: free-text search ---- */
.fsearch{margin:8px 0 28px;padding:18px;border:1px solid var(--line);border-radius:18px;background:var(--card)}
.fslabel{display:block;font-weight:700;font-size:18px;margin-bottom:8px}
.fsrow{display:flex;gap:8px;flex-wrap:wrap}.fsrow input{flex:1 1 240px;min-width:0;font:inherit;font-size:16px;padding:12px 14px;border-radius:12px;border:1px solid var(--line2);background:var(--bg2);color:var(--text)}
.fsrow input:focus-visible{outline:2px solid var(--acc2);outline-offset:1px}.fsrow .btn{margin:0;min-height:46px}
.fsx{flex-wrap:wrap;overflow:visible;margin-top:10px}.fsx .chip{min-height:36px}
.fcard .fprice{margin:8px 0 0;color:var(--text2)}.fcard .fchk{color:var(--mut);font-size:12.5px}
.fcard .fplay{margin:8px 0 0;font-size:14px;padding:8px 10px;border-left:3px solid #2dd4bf;background:var(--bg2);border-radius:6px}
.fcard .fwhy{font-size:12.5px}.fplays{padding-left:20px}.fplays li{margin:6px 0}
@media(max-width:520px){.fsrow .btn{width:100%}.fsearch{padding:14px}}
/* play page image (source media or tool logo) */
.ucthumb{margin:14px 0 6px;max-width:640px}.ucthumb img{display:block;width:100%;height:auto;border-radius:14px;border:1px solid var(--line)}
.ucthumb.uclogo img{width:64px;height:64px;border-radius:14px}
/* long unbroken titles (e.g. "Anthropic/OpenAI/Gemini") must wrap on phones */
.detail h1,.detail h2,.detail h3{overflow-wrap:anywhere}

/* decision-models guide comparison: wrap cell text so all 4 models fit on desktop */
.detail table.cmp.dm{table-layout:fixed;min-width:760px}
.detail table.cmp.dm td,.detail table.cmp.dm th{white-space:normal;min-width:0;vertical-align:top;overflow-wrap:anywhere}
.detail table.cmp.dm th[scope=row]{width:16%}

.tplcard .dtimg{margin:-4px 0 10px}.tplcard .dtimg img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:10px}.tplcard .credit{font-size:.75rem;margin-top:8px}
@media(min-width:1000px){.dstrip:has(>:nth-child(6):last-child){grid-template-columns:repeat(3,minmax(0,1fr))}.dstrip:has(>:nth-child(6):last-child)>.tplcard{grid-column:span 2;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);column-gap:18px;align-content:start}.dstrip:has(>:nth-child(6):last-child)>.tplcard .dtimg{grid-row:1/span 5;margin:0}.dstrip:has(>:nth-child(6):last-child)>.tplcard .sum{-webkit-line-clamp:unset;display:block;overflow:visible}.dstrip:has(>:nth-child(6):last-child)>.sponsored{grid-column:1/-1}}
.tplcard .sum{-webkit-line-clamp:unset;line-clamp:unset;display:block;overflow:visible}

/* Today in AI: heading stays "Today in AI"; older items get a separate "Updated <date>" line (1015c) */
.today-ttl{display:flex;flex-direction:column;gap:4px;min-width:0}
.today-upd{margin:0;font-size:13px;font-weight:500;color:var(--mut);letter-spacing:0}
/* homepage plays: category filter chips above the list (1015c); phone = sideways scroll, desktop = sticky under the header */
.pfbar{margin:0 0 12px}
.pchips{flex-wrap:nowrap;overflow-x:auto;padding:8px 2px 10px;-webkit-mask-image:linear-gradient(90deg,#000 88%,transparent);mask-image:linear-gradient(90deg,#000 88%,transparent)}
.pchips .chip{min-height:36px}
.pchips .xchip{border-style:dashed}
@media(min-width:900px){
 .pfbar{position:sticky;top:var(--toph,60px);z-index:15;margin:0 -26px 12px;padding:0 26px;background:var(--card-s);border-bottom:1px solid var(--line)}
 .pchips{flex-wrap:wrap;overflow:visible;-webkit-mask-image:none;mask-image:none}
}
/* affiliate disclosure, shown right before any affiliate link (1015c) */
.affnote{font-size:12px;line-height:1.45;color:var(--mut);margin:8px 0 6px;max-width:68ch}

.ev-tested-by-agentplays{color:#34d399;border-color:rgba(52,211,153,.4)}[data-theme=light] .ev-tested-by-agentplays{color:#047857}
.ucthumb figcaption{margin-top:6px}
/* news card footer: never truncate the source name (e.g. "TIME" was cut to "TI…" at 390px); wrap instead */
.ncard .nfoot{flex-wrap:wrap;row-gap:4px}.ncard .nfoot .nsrc{flex:0 1 auto;white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere}.ncard .nfoot .ncredit{min-width:0;overflow-wrap:anywhere}
@media(max-width:639px){.ncard .nfoot .dot:has(+.ncredit){display:none}.ncard .nfoot .ncredit{flex:1 1 100%;order:3}.ncard .nfoot .ext{order:2}}

/* main nav (QC Oct 16): labels never wrap; from 900px to 1169px the lower-priority links move into the ☰ menu (it lists every page) */
.dnav a{white-space:nowrap}
@media(min-width:900px) and (max-width:1169px){.top .menu{display:block}.dnav a:nth-child(n+10){display:none}}
@media(min-width:900px) and (max-width:999px){.dnav a:nth-child(6),.dnav a:nth-child(7){display:none}}

/* header fix (Oct 16 1:10 PM, QC spec): the ☰ dropdown scrolls inside the screen; the top row shows only links that fully fit (8 at 1170px+, 6 at 1000-1169px, 5 at 900-999px), no sideways scroll or fade; the ☰ menu lists every page */
.menu nav{max-height:calc(100vh - 70px);max-height:calc(100dvh - 70px);overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
@media(min-width:900px){.dnav{flex:0 1 auto;min-width:0;overflow:visible;-webkit-mask-image:none;mask-image:none}.dnav a,.dnav a:nth-child(n){display:inline-flex}.dnav a:nth-child(n+9){display:none}.top .menu{display:block}}
@media(min-width:900px) and (max-width:1169px){.dnav a:nth-child(n+7){display:none}}
@media(min-width:900px) and (max-width:999px){.dnav a:nth-child(n+6){display:none}}

/* ---- features: search, radar, can-i-run-it, plans, tested badge (scripts/features.css) ---- */
.hsearch{position:relative;flex:1 1 140px;max-width:240px;min-width:0;margin-left:4px}
.hsearch input{width:100%;height:36px;padding:0 10px 0 32px;border-radius:9px;border:1px solid var(--line);background:var(--card) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%238b90a0' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='7' cy='7' r='5'/%3E%3Cpath d='m11 11 4 4'/%3E%3C/svg%3E") no-repeat 10px 50%;color:var(--text);font:inherit;font-size:14px}
.hsearch input:focus{outline:none;border-color:var(--acc2)}
.hsres{position:absolute;right:0;top:44px;width:min(380px,calc(100vw - 32px));background:var(--card-s);border:1px solid var(--line2);border-radius:14px;padding:8px;box-shadow:0 20px 50px -10px rgba(0,0,0,.45);z-index:30}
.hsi{display:flex;gap:8px;align-items:baseline;padding:7px 6px;border-radius:8px;font-size:14px;line-height:1.35}.hsi:hover{background:var(--hov)}.hsi a{color:var(--text);text-decoration:none}
.hsall{display:block;padding:8px 6px 4px;font-size:13.5px;font-weight:600}.hsres .meta{padding:6px}
.stype{flex:0 0 auto;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--mut);border:1px solid var(--line2);border-radius:999px;padding:1px 7px}
.st-n{color:#38bdf8}.st-t{color:#a78bfa}.st-p{color:#7fb8ff}.st-g{color:#4ade80}.st-x{color:var(--acc)}
@media(min-width:900px) and (max-width:1279px){.hsearch{flex:0 0 120px}.hsearch:focus-within{flex-basis:220px}}
@media(max-width:899px){.logo{margin-right:0}.hsearch{max-width:none;margin-left:auto}}
@media(max-width:380px){.logo{font-size:0;gap:0}}
.sform{display:flex;gap:8px;margin:8px 0}.sform input{flex:1;min-width:0;padding:12px 14px;border-radius:12px;border:1px solid var(--line2);background:var(--card);color:var(--text);font:inherit;font-size:16px}
.sres{list-style:none;padding:0;margin:8px 0}.sitem{display:flex;gap:12px;align-items:baseline;padding:12px 0;border-bottom:1px solid var(--line)}.sitem h2{font-size:16.5px;margin:0 0 2px;line-height:1.35}.sitem h2 a{color:var(--text);text-decoration:none}.sitem h2 a:hover{color:var(--acc)}.sitem .meta{margin:0}
.rtl{list-style:none;padding:0;margin:8px 0}.rday h2{font-size:15px;color:var(--mut);margin:22px 0 6px;letter-spacing:.01em}
.rlist{list-style:none;margin:0;padding:0 0 0 14px;border-left:2px solid var(--line2)}
.ritem{position:relative;display:grid;grid-template-columns:1fr;gap:2px;padding:9px 0 9px 6px}.ritem::before{content:"";position:absolute;left:-21px;top:16px;width:10px;height:10px;border-radius:50%;background:var(--acc2);box-shadow:0 0 0 3px var(--bg)}
.ritem time{display:none}.ritem a{font-weight:600;color:var(--text);text-decoration:none}.ritem a:hover{color:var(--acc)}.ritem .tag{margin-right:4px}
.rk-model{color:#38bdf8}.rk-tool{color:#a78bfa}.rc{opacity:.7;font-weight:500;margin-left:2px}
.rstrip-sec{--th:56,189,248}.rstrip{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:4px}
.rstrip li{display:flex;gap:10px;align-items:baseline;padding:9px 12px;border:1px solid var(--line);border-radius:12px;background:var(--card);min-width:0}
.rstrip time{flex:0 0 52px;color:var(--mut);font-size:13px;font-variant-numeric:tabular-nums}.rstrip .tag{flex:0 0 auto}
.rstrip a{color:var(--text);text-decoration:none;font-weight:600;font-size:14.5px;line-height:1.35;min-width:0;overflow-wrap:anywhere}.rstrip a:hover{color:var(--acc)}
@media(max-width:520px){.rstrip li{flex-wrap:wrap;gap:4px 8px}.rstrip a{flex-basis:100%}}
.hwform{display:grid;gap:10px;margin:16px 0 8px;padding:16px;border:1px solid var(--line);border-radius:16px;background:var(--card)}
.hwrow{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:flex-end}.hwform label{display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--mut);font-weight:600}
.hwform select,.hwform input[type=number]{font:inherit;font-size:15px;padding:8px 10px;border-radius:10px;border:1px solid var(--line2);background:var(--card-s);color:var(--text);min-width:0;max-width:100%}
.hwform label.hwchk{flex-direction:row;align-items:center;gap:8px;color:var(--text2);font-weight:500;font-size:14px;padding-bottom:8px}
.hwsum{font-size:16px;margin:10px 0}.hwshare{margin:4px 0 12px}
.hwt td,.hwt th{white-space:normal;vertical-align:top}.hwt th[scope=row]{min-width:180px;font-size:14px;text-transform:none;letter-spacing:0;color:var(--text);background:none;font-weight:600}
.hwt th[scope=row] a{color:var(--text)}.hwt .meta{display:block;font-size:12px;margin:2px 0 0}.hwsub{font-weight:400}
.hwt caption{caption-side:bottom;text-align:left;padding:10px 14px}
.qc b{font-variant-numeric:tabular-nums}.qc.ok b{color:#4ade80}.qc.no b{color:var(--mut);font-weight:500}[data-theme=light] .qc.ok b{color:#15803d}
.fit{display:inline-block;font-size:12px;font-weight:700;padding:2px 9px;border-radius:999px;border:1px solid var(--line2);white-space:nowrap}
.fit-yes{color:#4ade80;border-color:rgba(74,222,128,.4);background:rgba(74,222,128,.08)}.fit-tight{color:#b8d42e;border-color:rgba(184,212,46,.4);background:rgba(184,212,46,.08)}.fit-no{color:var(--mut)}
[data-theme=light] .fit-yes{color:#15803d}[data-theme=light] .fit-tight{color:#3f5800}
.ptab td,.ptab th{white-space:normal;vertical-align:top}.ptab th[scope=row]{font-size:14px;text-transform:none;letter-spacing:0;color:var(--text);background:none;font-weight:700;min-width:110px}
.ptab td .meta{display:block;font-size:12px;margin-top:2px}.np{color:var(--mut);font-style:italic}.psvc{margin:28px 0}.psvc h2{margin-bottom:4px}
@media(max-width:700px){
 .ptab thead,.hwt thead{display:none}.ptab,.ptab tbody,.ptab tr,.ptab td,.ptab th,.hwt,.hwt tbody,.hwt tr,.hwt td,.hwt th{display:block;width:100%}
 .ptab tr,.hwt tr{padding:10px 14px;border-bottom:1px solid var(--line)}.ptab td,.ptab th,.hwt td,.hwt th{border:0;padding:4px 0}
 .ptab td::before,.hwt td::before{content:attr(data-label);display:block;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--mut);font-weight:600}
 .hwt tr[hidden]{display:none}.hwt caption{display:block}
}
.tested{margin:6px 0 10px}.tested-badge{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:700;padding:3px 11px;border-radius:999px;color:#4ade80;border:1px solid rgba(74,222,128,.45);background:rgba(74,222,128,.10)}
.tested-badge::before{content:"✓"}[data-theme=light] .tested-badge{color:#15803d}
.ritem[hidden],.rday[hidden],.sitem[hidden]{display:none}
.dnav a{white-space:nowrap}.hwform [hidden]{display:none}
@media(min-width:900px){.logo{margin-right:16px}}
@media(min-width:900px){.menu{display:block}}
a.chip{text-decoration:none}

/* ---- modern pass: hero story, card images, view transitions, share cards (scripts/modern.css) ---- */
/* homepage hero: top story card + intro (mobile first: story first, then the intro and search) */
.hero2{display:grid;gap:24px;padding:16px 0 4px;margin-top:0}
.hero2 h1 .hico{display:none}
.hero2 .hintro{order:2}
.hero2 .hstory{order:1}
.hstory{position:relative;display:flex;flex-direction:column;text-align:left;background:var(--card);border:1px solid var(--line2);border-radius:var(--r,16px);overflow:hidden;box-shadow:var(--shadow);transition:border-color .25s,transform .3s var(--ease),box-shadow .3s var(--ease)}
.hstory:hover{border-color:color-mix(in srgb,var(--acc) 45%,var(--line2));transform:translateY(-2px);box-shadow:var(--shadow),0 18px 40px -18px rgba(0,0,0,.55)}
.hsimg{display:block;aspect-ratio:1200/630;overflow:hidden;background:var(--bg2);border-bottom:1px solid var(--line)}
.hsimg img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.hstory:hover .hsimg img{transform:scale(1.03)}
.hsbody{padding:16px 18px 18px}
.hskick{display:flex;align-items:center;gap:8px;margin:0 0 8px;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--acc)}
.hskick time{color:var(--mut);letter-spacing:.04em}
.hstory h2{font-size:clamp(20px,5.4vw,26px);line-height:1.22;letter-spacing:-.02em;margin:0 0 8px}
.hstory h2 a{color:var(--text);text-decoration:none}.hstory h2 a:hover{text-decoration:underline;text-underline-offset:3px}
.hssum{color:var(--text2);margin:0 0 14px;font-size:15px;line-height:1.55}
.hsfoot{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 10px}
.hsupd{margin:0;font-size:13px}
@media(min-width:900px){
 .hero2{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);align-items:center;gap:48px;padding:40px 0 12px}
 .hero2 .hintro{text-align:left}
 .hero2 .hintro h1{font-size:clamp(36px,3.5vw,50px);margin:0 0 14px;max-width:none}
 .hero2 .hintro .lead{margin:0 0 20px;max-width:none}
 .hero2 .hintro .status{justify-content:flex-start}
 .hero2 #q{max-width:none}
 .hstory h2{font-size:clamp(22px,2vw,28px)}
 .hsbody{padding:20px 24px 22px}
}
/* card grid: roomier, one image ratio on every card (real image, else the item's own share card) */
@media(min-width:640px){.grid{gap:20px}}
.card.hasimg{padding-top:0}
.cimg{margin:0 calc(-1*var(--s3,18px)) 14px;aspect-ratio:1200/630;overflow:hidden;border-radius:calc(var(--r,16px) - 1px) calc(var(--r,16px) - 1px) 0 0;border-bottom:1px solid var(--line);background:var(--bg2)}
.cimg img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.card:hover .cimg img{transform:scale(1.03)}
.nimg{aspect-ratio:1200/630}
.nimg.nog img{object-fit:cover}
.card:hover{box-shadow:var(--shadow),0 16px 36px -18px rgba(0,0,0,.5)}
[data-theme=light] .card:hover,[data-theme=light] .hstory:hover{box-shadow:var(--shadow),0 16px 36px -18px rgba(15,18,30,.25)}
.cimg.broken,.nimg.broken{display:none}
/* smooth page-to-page navigation (cross-document View Transitions); the header stays put */
@view-transition{navigation:auto}
.top{view-transition-name:site-top}
::view-transition-old(root),::view-transition-new(root){animation-duration:.22s}
/* share-my-result cards (can-i-run-it, Battle) */
.scbox{margin:14px 0 0}
.scbox .row{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.scprev{display:block;width:100%;max-width:600px;height:auto;margin:12px 0 0;border-radius:12px;border:1px solid var(--line2)}
.scstat{margin:8px 0 0}
@media(prefers-reduced-motion:reduce){
 @view-transition{navigation:none}
 ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}
 .hstory:hover,.card:hover{transform:none}
 .card:hover .cimg img,.ncard:hover .nimg img,.hstory:hover .hsimg img{transform:none}
}

/* Shared: any card with a fixed dark surface gets light text in BOTH themes, so it never inherits the light-mode --text */
.dkcard,.t-card{color:var(--text)}

/* ===== 10/20 design pass: base surfaces, one base button (themed) ===== */
/* Theme tokens (10/20 light mode returns). Every surface uses these; no hardcoded backgrounds. */
:root,[data-theme=dark]{color-scheme:dark;--bg:#0b0b0f;--bg2:#111116;--card:#16161c;--border:#26262e;--border2:#3a3a44;--text:#f4f4f6;--text2:#d4d4d8;--muted:#a1a1aa;--accent:#c6f432;--accent-h:#d6ff4f;--accent-text:#c6f432;--on-accent:#0b0b0f;--soft:var(--soft);--soft2:var(--soft2)}
[data-theme=light]{color-scheme:light;--bg:#f6f6f8;--bg2:#ececf0;--card:#ffffff;--border:#d9d9e0;--border2:#a8a8b3;--text:#16161c;--text2:#3a3a44;--muted:#55555f;--accent:#c6f432;--accent-h:#b5e31f;--accent-text:#3f6212;--on-accent:#0b0b0f;--soft:rgba(15,15,25,.05);--soft2:rgba(15,15,25,.09)}
:root,[data-theme]{--card-s:var(--card);--line:var(--border);--line2:var(--border2);--mut:var(--muted);--hov:var(--soft);--lime:var(--accent);--on:var(--text)}
html,body{background-color:var(--bg)}
.card,.rdtile,.hstory,.rdnews,.lchat,.mcard{background-color:var(--card);border-color:var(--border)}
h1,h2,h3,h4{color:var(--text)}
/* Base button: lime filled by default (never transparent). Variants: .outline, .ghost */
a.btn,button.btn,.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:40px;padding:9px 18px;border-radius:999px;border:1px solid var(--accent);background:var(--accent);color:var(--on-accent);font-family:inherit;font-weight:700;line-height:1.2;text-decoration:none;cursor:pointer;box-shadow:0 6px 18px -10px rgba(198,244,50,.6);transition:background .15s,border-color .15s,color .15s,transform .15s,box-shadow .15s}
a.btn:hover,button.btn:hover,.btn:hover{background:var(--accent-h);border-color:var(--accent-h);color:var(--on-accent);transform:translateY(-1px)}
a.btn:focus-visible,button.btn:focus-visible,.btn:focus-visible{outline:2px solid var(--text);outline-offset:3px}
a.btn.outline,button.btn.outline,.btn.outline,a.btn.ghost,button.btn.ghost,.btn.ghost{background:transparent;color:var(--text);border-color:var(--border2);box-shadow:none}
a.btn.outline:hover,button.btn.outline:hover,.btn.outline:hover{background:var(--soft);border-color:var(--text);color:var(--text)}
a.btn.ghost,button.btn.ghost,.btn.ghost{border-color:transparent;background:var(--soft)}
a.btn.ghost:hover,button.btn.ghost:hover,.btn.ghost:hover{background:var(--soft2);color:var(--text)}
.btn:disabled,.btn[aria-disabled=true]{opacity:1;background:var(--soft);color:var(--text2);border:1px dashed var(--border2);box-shadow:none;cursor:not-allowed;transform:none}
.rdf a.btn,.rdf a.btn:hover{color:var(--on-accent)}
/* display names: one line, clean truncation */
.dn-trunc{display:inline-block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:bottom}
.mc-name.dn-trunc,.mc-dn.dn-trunc{display:block}
.mc-dn{color:var(--muted);font-size:.85rem}
.lc-handle{color:var(--muted);font-size:.78rem;font-weight:500;margin-left:4px;max-width:12ch}
.who b.dn-trunc{max-width:16ch}
@media(max-width:600px){.who b.dn-trunc{max-width:11ch}.lc-handle{display:none}}
/* chat closed: one slim bar */
.lc-soon,.ls-soon{display:none}
.lchat.lc-isclosed{padding:12px 16px;gap:0;min-height:0!important;height:auto!important}
.lchat.lc-isclosed .lc-body,.lchat.lc-isclosed .lc-collapse,.lchat.lc-isclosed .lc-meta,.lchat.lc-isclosed .lc-back{display:none!important}
.lchat.lc-isclosed .lc-head{margin:0;padding:0;border:0;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.lchat.lc-isclosed .lc-head h2{font-size:1rem;margin:0}
.lchat.lc-isclosed .lc-soon{display:inline;color:var(--text2);font-size:.9rem}
:has(> #lchat.lc-isclosed) > .lc-strip .ls-soon,.forum:has(#lchat.lc-isclosed) .ls-soon{display:inline;color:var(--text2);margin-left:auto;padding-right:10px}
.forum:has(#lchat.lc-isclosed) .lc-strip{pointer-events:none;cursor:default;color:var(--text)}
.forum:has(#lchat.lc-isclosed) .lc-strip .ls-o,.forum:has(#lchat.lc-isclosed) .lc-strip .ls-c{display:none}
html.lc-open .lchat.lc-isclosed{position:static}
/* signup closed: note only */
.apsign.aps-isclosed .aps-tabs,.apsign.aps-isclosed .aps-card>.meta{display:none}
.apsign.aps-isclosed .aps-closed{font-size:1.05rem;color:var(--text);margin:8px 0 0}
.ncard .nfoot .dot,.dot[aria-hidden=true]:not(.live){color:var(--muted)}
#lchat.lc-isclosed,.lchat.lc-isclosed{padding:14px 24px!important}
@media(max-width:600px){#lchat.lc-isclosed,.lchat.lc-isclosed{padding:12px 18px!important}}

.nlpriv{margin:8px 0 0;font-size:13px;color:var(--muted)}.nlpriv a{color:var(--accent-text)}.t-notify{max-width:560px;margin:32px auto 8px;padding:22px;background:var(--card);border:1px solid var(--border);border-radius:16px}.t-notify h2{margin:0 0 12px;font-size:18px;color:var(--text)}.t-notify .nlrow{display:flex;gap:8px;flex-wrap:wrap}.t-notify input[type=email]{flex:1 1 220px;min-height:40px;padding:8px 12px;border-radius:10px;border:1px solid var(--border2);background:var(--bg);color:var(--text)}
/* QC 2026-10-20: no sideways scroll on phones, hidden empty previews, tap targets, body-link underlines */
.btn{max-width:100%;white-space:normal;overflow-wrap:anywhere}
.card,.cimg,img{max-width:100%}
img.scprev:not([src]),img.scprev[src=""]{display:none}
.tags a,.chips a,.chips button,.bt-chip,a.tag,button.tag,.pager a,.pagination a,.g3loadmore .btn{min-height:44px;display:inline-flex;align-items:center;justify-content:center}
main p a:not(.btn):not(.tag),main li a:not(.btn):not(.tag),.nlpriv a,.lead a{text-decoration:underline;text-underline-offset:2px}
.btn{box-sizing:border-box}
.grid>*{min-width:0}
@media(max-width:639px){.grid{grid-template-columns:minmax(0,1fr)}}
html body .btn{white-space:normal;overflow-wrap:anywhere;max-width:100%}

.fw-name:not(:empty)::before{content:", ";font-weight:400}
