/* Kucing Content Radar. Layout and colours carried over from the old claude.ai Radar page. */
:root{
  color-scheme:light;
  --bg:#F3F6F5; --surface:#FFFFFF; --ink:#17202A; --muted:#5A6570; --faint:#8A949D; --line:#DCE3E1;
  --accent:#0B7A75; --accent-ink:#FFFFFF; --accent-soft:#E0F1EF;
  --buy:#1E7A3A; --buy-bg:#E2F3E6; --prob:#955800; --prob-bg:#FBEED6;
  --myth:#5646BF; --myth-bg:#ECE9FB; --contra:#B0224A; --contra-bg:#FBE3EA;
  --bar:#0B7A75; --bar-bg:#E6ECEA; --warn-bg:#FFF6E5; --warn-line:#EBCB8B;
  --display:"Bricolage Grotesque", "Segoe UI", system-ui, sans-serif;
  --body:"Instrument Sans", "Segoe UI", system-ui, -apple-system, sans-serif;
  --mono:"JetBrains Mono", ui-monospace, "SFMono-Regular", Consolas, monospace;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    color-scheme:dark;
    --bg:#0E1417; --surface:#151C21; --ink:#E4EBEE; --muted:#9AA6AF; --faint:#6E7A83; --line:#25313A;
    --accent:#3BC0B6; --accent-ink:#06201E; --accent-soft:#12302E;
    --buy:#6FD08C; --buy-bg:#16301E; --prob:#F0B45A; --prob-bg:#35270F;
    --myth:#A99BFF; --myth-bg:#241F45; --contra:#FF8AA8; --contra-bg:#3B1824;
    --bar:#3BC0B6; --bar-bg:#23303A; --warn-bg:#2E2512; --warn-line:#6B5424;
  }
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --bg:#0E1417; --surface:#151C21; --ink:#E4EBEE; --muted:#9AA6AF; --faint:#6E7A83; --line:#25313A;
  --accent:#3BC0B6; --accent-ink:#06201E; --accent-soft:#12302E;
  --buy:#6FD08C; --buy-bg:#16301E; --prob:#F0B45A; --prob-bg:#35270F;
  --myth:#A99BFF; --myth-bg:#241F45; --contra:#FF8AA8; --contra-bg:#3B1824;
  --bar:#3BC0B6; --bar-bg:#23303A; --warn-bg:#2E2512; --warn-line:#6B5424;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--body);font-size:15px;line-height:1.5;
  padding:max(20px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(48px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left))}
.wrap{max-width:1180px;margin:0 auto;display:flex;flex-direction:column;gap:22px}
.stack{display:flex;flex-direction:column;gap:10px}
h1,h2,h3{font-family:var(--display);font-weight:700;margin:0;text-wrap:balance;letter-spacing:-.01em}
h1{font-size:30px;line-height:1.1}
h2{font-size:20px}
a{color:var(--accent)}
button,select,input{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.num{font-family:var(--mono);font-variant-numeric:tabular-nums}
.label{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:600}
.muted{color:var(--muted)}

/* login */
.login{min-height:80vh;display:grid;grid-template-columns:minmax(0,1fr);place-items:center}
.logincard{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:24px;width:100%;max-width:420px;display:flex;flex-direction:column;gap:14px}
.logincard form{display:flex;flex-direction:column;gap:8px}
.logincard input{background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:10px 12px;font-size:16px}

/* header */
.top{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:12px 24px}
.top p{margin:6px 0 0;color:var(--muted);max-width:62ch}
.runbox{display:flex;flex-direction:column;gap:6px;align-items:flex-start;font-size:13px}
.runline{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.dot{width:8px;height:8px;border-radius:50%;background:var(--accent);display:inline-block}
.btn{border:1px solid var(--line);background:var(--surface);border-radius:8px;padding:7px 12px;cursor:pointer}
.btn[disabled]{cursor:not-allowed;color:var(--faint)}
.btn.primary{background:var(--accent);color:var(--accent-ink);border-color:var(--accent);font-weight:600}
.btn.primary[disabled]{opacity:.55;color:var(--accent-ink)}
.btn.small{padding:4px 10px;font-size:13px}

/* mode tabs */
.modes{display:flex;gap:4px;border-bottom:1px solid var(--line);overflow-x:auto}
.mode{border:0;background:none;padding:10px 16px;font-family:var(--display);font-weight:700;font-size:17px;color:var(--muted);cursor:pointer;border-bottom:3px solid transparent;margin-bottom:-1px;white-space:nowrap}
.mode[aria-selected="true"]{color:var(--ink);border-bottom-color:var(--accent)}
.mode .count{font-family:var(--mono);font-size:12px;color:var(--faint);margin-left:6px}

/* competitor strip */
.comps{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px}
.comp{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:12px 14px;display:flex;flex-direction:column;gap:4px;text-align:left;cursor:pointer}
.comp[aria-pressed="true"]{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent) inset}
.comp.paused{opacity:.6}
.comp .name{font-weight:600}
.comp .handle{font-size:13px;color:var(--muted);overflow-wrap:anywhere}
.comp .stats{display:flex;gap:14px;font-size:12px;color:var(--muted);margin-top:4px;flex-wrap:wrap}
.comp .stats b{color:var(--ink);font-family:var(--mono);font-weight:600}
.manage{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:10px 14px}
.manage summary{cursor:pointer;font-size:13px;font-weight:600;color:var(--accent)}
.compform{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 6px}
.compform input,.compform select{background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:8px 10px;min-width:0;flex:1 1 160px}
.compform select{flex:0 1 120px}
.complist{display:flex;flex-direction:column;gap:6px;margin-top:8px}
.comprow{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:14px;border-top:1px solid var(--line);padding-top:6px}

.chip{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:600;border-radius:999px;padding:2px 8px;white-space:nowrap}
.chip.status-done{background:var(--accent-soft);color:var(--accent)}
.chip.status-wait{background:var(--bar-bg);color:var(--muted)}
.chip.viral{background:var(--accent);color:var(--accent-ink)}
.chip.recent{background:var(--bar-bg);color:var(--muted)}
.chip.outlier{background:var(--warn-bg);color:var(--prob);border:1px solid var(--warn-line)}
.chip.t-buying{background:var(--buy-bg);color:var(--buy)}
.chip.t-problem{background:var(--prob-bg);color:var(--prob)}
.chip.t-myth{background:var(--myth-bg);color:var(--myth)}
.chip.t-controversial{background:var(--contra-bg);color:var(--contra)}
.chip.t-other{background:var(--bar-bg);color:var(--muted)}
.chip.prod{border:1px solid var(--accent);color:var(--accent);background:transparent}
.chip.buystars{background:var(--bar-bg);color:var(--muted);letter-spacing:.02em}
.chip.buystars.s4,.chip.buystars.s5{background:var(--buy-bg);color:var(--buy)}
.chip.buystars.s5{box-shadow:0 0 0 1px var(--buy) inset}
.chip.buystars.s3{background:var(--buy-bg);color:var(--buy);opacity:.85}
.chip.st-queued{background:var(--warn-bg);color:var(--prob);border:1px solid var(--warn-line)}
.chip.st-scripted,.chip.st-made{background:var(--accent-soft);color:var(--accent)}
.chip.st-posted{background:var(--buy-bg);color:var(--buy)}
.chip.st-dropped{background:var(--bar-bg);color:var(--faint)}

/* best-at summary */
.best{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:10px}
.bestcard{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:14px;display:flex;flex-direction:column;gap:6px}
.bestcard .big{font-family:var(--mono);font-size:24px;font-weight:600;line-height:1}
.bestcard .hook{font-family:var(--display);font-weight:500;font-size:15px;line-height:1.3}
.bestcard .who{font-size:12px;color:var(--muted)}

/* toolbar */
.tools{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.tools select,.tools input{background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:8px 10px;min-width:0;max-width:100%}
.tools input{flex:1 1 240px}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:8px;overflow:hidden;background:var(--surface);max-width:100%;overflow-x:auto}
.seg button{border:0;background:none;padding:8px 12px;cursor:pointer;color:var(--muted);white-space:nowrap}
.seg button[aria-pressed="true"]{background:var(--accent-soft);color:var(--accent);font-weight:600}
.resultline{font-size:13px;color:var(--muted)}

/* posts */
.posts{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-radius:12px}
.post{display:grid;grid-template-columns:170px minmax(0,1fr) 250px;gap:18px;padding:18px;border-top:1px solid var(--line)}
.post:first-child{border-top:0}
.meta{display:flex;flex-direction:column;gap:6px;font-size:13px}
.meta .date{font-family:var(--mono);font-weight:600;font-size:13px}
.meta .who{font-weight:600}
.meta .fmt{color:var(--muted)}
.meta .chips{display:flex;flex-wrap:wrap;gap:4px}
.content{display:flex;flex-direction:column;gap:8px;min-width:0}
.texthook{font-family:var(--display);font-weight:700;font-size:19px;line-height:1.2}
.texthook.none{font-weight:500;font-size:14px;color:var(--faint);font-family:var(--body)}
.hookrow{display:grid;grid-template-columns:78px minmax(0,1fr);gap:8px;font-size:14px}
.hookrow .label{padding-top:2px}
.verbal{font-style:italic}
.caption{font-size:14px;color:var(--ink);background:var(--bg);border-radius:8px;padding:8px 10px}
.tags{display:flex;flex-wrap:wrap;gap:6px;font-size:13px;color:var(--accent)}
.link{font-size:13px}
.numbers{display:flex;flex-direction:column;gap:10px}
.counts{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;text-align:left}
.counts div{display:flex;flex-direction:column}
.counts .v{font-family:var(--mono);font-weight:600;font-size:15px}
.counts .k{font-size:11px;color:var(--muted)}
.ratio{display:grid;grid-template-columns:62px 1fr 44px;gap:8px;align-items:center;font-size:12px}
.ratio .track{height:6px;border-radius:3px;background:var(--bar-bg);overflow:hidden;display:block}
.ratio .fill{height:100%;background:var(--bar);border-radius:3px;display:block}
.ratio .val{font-family:var(--mono);text-align:right;font-weight:600}
.ratiohead{font-size:11px;color:var(--muted)}
details.ins,details.bd{grid-column:2 / 4}
details.ins{border-top:1px dashed var(--line);padding-top:10px}
details.ins summary,details.bd summary{cursor:pointer;font-size:13px;font-weight:600;color:var(--accent);list-style:none}
details.ins summary::-webkit-details-marker,details.bd summary::-webkit-details-marker{display:none}
details.ins summary::before,details.bd summary::before{content:"▸ "}
details.ins[open] summary::before,details.bd[open] summary::before{content:"▾ "}
.inslist{display:flex;flex-direction:column;gap:6px;margin-top:8px}
.insrow{display:grid;grid-template-columns:118px minmax(0,1fr) auto;gap:10px;align-items:start;font-size:14px}
.likes{font-family:var(--mono);font-size:12px;color:var(--muted);white-space:nowrap}
.txt{display:flex;flex-wrap:wrap;gap:6px;align-items:center}

/* ads extras */
.adbox{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px}
.panel{border:1px solid var(--line);border-radius:10px;padding:12px;display:flex;flex-direction:column;gap:6px;font-size:14px}
.panel.claim{background:var(--warn-bg);border-color:var(--warn-line)}
.search{display:flex;flex-wrap:wrap;gap:6px}
.search span{font-size:13px;background:var(--bg);border:1px solid var(--line);border-radius:6px;padding:2px 8px}
.price{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.price .now{font-family:var(--mono);font-size:22px;font-weight:600}
.price .was{font-family:var(--mono);color:var(--faint);text-decoration:line-through}

/* board */
.board{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:16px;align-items:start}
.boardlist{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:10px}
.boardrow{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;padding-bottom:10px;border-bottom:1px solid var(--line);font-size:14px}
.boardrow:last-child{border-bottom:0;padding-bottom:0}
.boardrow .src{font-size:12px;color:var(--muted);margin-top:2px}
.side{display:flex;flex-direction:column;gap:12px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:8px}
.prodbar{display:grid;grid-template-columns:96px 1fr 28px;gap:8px;align-items:center;font-size:13px}
.calc{display:grid;grid-template-columns:1fr auto;gap:4px 12px;font-size:14px}
.calc .num{text-align:right;font-weight:600}
.note{font-size:12px;color:var(--muted)}
.empty{padding:28px 18px;text-align:center;color:var(--muted)}
.banner{background:var(--warn-bg);border:1px solid var(--warn-line);border-radius:10px;padding:12px 14px;font-size:14px}

/* breakdown */
.steps{margin:8px 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px;counter-reset:st}
.steps li{display:grid;grid-template-columns:26px minmax(0,1fr);gap:8px;font-size:14px;counter-increment:st}
.steps li::before{content:counter(st);font-family:var(--mono);font-weight:600;color:var(--accent-ink);background:var(--accent);border-radius:50%;width:22px;height:22px;display:grid;place-items:center;font-size:12px}
.steps .sl{font-weight:600}
.steps .sq{font-style:italic;color:var(--muted)}

/* ideas */
.ideas{display:flex;flex-direction:column;gap:10px}
.idea{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:14px 16px;display:flex;flex-direction:column;gap:8px}
.idea .chips{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.chip.pri-High{background:var(--accent);color:var(--accent-ink)}
.chip.pri-Medium{background:var(--accent-soft);color:var(--accent)}
.chip.pri-Low{background:var(--bar-bg);color:var(--muted)}
.idea h3{font-size:18px;line-height:1.25}
.idea .angle{font-size:14px}
.idea .src{font-size:13px;color:var(--muted);border-left:3px solid var(--line);padding-left:10px}
.idea .row{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:space-between}
.idea .row select{background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:6px 8px;font-size:13px}
details.oldscript summary{cursor:pointer;font-size:13px;font-weight:600;color:var(--accent)}
.script{border-top:1px dashed var(--line);padding-top:10px;margin-top:8px;display:flex;flex-direction:column;gap:10px}
.script .hookbig{font-family:var(--display);font-weight:700;font-size:20px;line-height:1.2}
.formula{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:8px}
.formula div{background:var(--bg);border-radius:8px;padding:8px 10px;font-size:13px}
.scenes{width:100%;border-collapse:collapse;font-size:14px}
.scenes th{text-align:left;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:600;padding:6px 8px;border-bottom:1px solid var(--line)}
.scenes td{vertical-align:top;padding:8px;border-bottom:1px solid var(--line)}
.scenes td.t{font-family:var(--mono);font-size:12px;white-space:nowrap;color:var(--muted)}
.scenes td.say{font-weight:500}
.tablewrap{overflow-x:auto}
.phr{display:flex;flex-direction:column;gap:6px;font-size:13px}
.phr b{font-weight:600}

@media (max-width: 900px){
  .post{grid-template-columns:minmax(0,1fr)}
  details.ins,details.bd{grid-column:1}
  .board{grid-template-columns:minmax(0,1fr)}
}
@media (max-width: 520px){
  h1{font-size:25px}
  .insrow{grid-template-columns:minmax(0,1fr)}
  .hookrow{grid-template-columns:minmax(0,1fr);gap:2px}
  .tools select{flex:1 1 140px}
}
@media (prefers-reduced-motion: reduce){*{transition:none!important}}

/* Buying signals: wins are ranked by buying comments; views only lift a post that has them */
.chip.win-triple{background:var(--buy);color:var(--accent-ink)}
.chip.win-double{background:var(--buy-bg);color:var(--buy);box-shadow:0 0 0 1px var(--buy) inset}
.chip.win-big{background:var(--buy-bg);color:var(--buy)}
.chip.win-watch{background:var(--bar-bg);color:var(--muted)}
.sechead h2{margin:0 0 4px}
.sechead p{margin:0;font-size:13px}
.wins{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(260px,100%),1fr));gap:10px}
.wincard{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:14px;display:flex;flex-direction:column;gap:6px;min-width:0}
.wincard.t-triple{border:2px solid var(--buy)}
.wincard .winhead{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:13px}
.wincard .hook{font-family:var(--display);font-weight:500;font-size:15px;line-height:1.3;overflow-wrap:anywhere}
.winnums{display:flex;flex-wrap:wrap;gap:4px 12px;font-size:13px}
.winbuys{margin:0;padding-left:18px;font-size:13px;color:var(--muted);overflow-wrap:anywhere}
.watch summary{cursor:pointer;font-weight:600;margin:8px 0}

/* Folding segments: tap the header to open or close; the app remembers each one */
.fold{border:1px solid var(--line);border-radius:12px;background:var(--surface);min-width:0}
.foldhead{all:unset;box-sizing:border-box;display:flex;align-items:center;gap:10px;width:100%;padding:14px 16px;cursor:pointer;
  font-family:var(--display);font-weight:700;font-size:18px;color:var(--ink)}
.foldhead:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:12px}
.foldhead .arrow{width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-top:8px solid var(--muted);
  transition:transform .15s ease;flex:none}
.foldhead[aria-expanded="false"] .arrow{transform:rotate(-90deg)}
.foldtitle{flex:1;min-width:0}
.foldcount{font-family:var(--mono);font-size:13px;font-weight:600;color:var(--muted)}
.foldbody{padding:0 16px 16px;display:flex;flex-direction:column;gap:12px;min-width:0}
.fold[data-open="0"] .foldbody{display:none}
.fold[hidden]{display:none}
.more{align-self:center}

/* Save / Remove */
.fbrow{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.fb{font:inherit;font-size:12px;font-weight:600;border-radius:999px;padding:4px 10px;cursor:pointer;border:1px solid var(--line);
  background:var(--surface);color:var(--ink)}
.fb.save[aria-pressed="true"]{background:var(--buy-bg);color:var(--buy);border-color:var(--buy)}
.fb.remove{color:var(--muted)}
.fb:disabled{opacity:.5;cursor:default}
.reasons{display:flex;flex-wrap:wrap;gap:6px;padding:8px;border:1px dashed var(--line);border-radius:10px}
.reasons .label{width:100%}
.chip.likerem{background:var(--bar-bg);color:var(--faint)}
.chip.likesav{background:var(--accent-soft);color:var(--accent)}
.chip.prod{cursor:pointer;font:inherit;font-size:11px;font-weight:600}

/* Products panel */
.dlg{border:1px solid var(--line);border-radius:14px;background:var(--bg);color:var(--ink);padding:0;
  width:min(720px,calc(100vw - 32px));max-height:calc(100vh - 48px)}
.dlg::backdrop{background:rgba(0,0,0,.45)}
.dlghead{position:sticky;top:0;display:flex;justify-content:space-between;align-items:center;gap:10px;padding:14px 16px;
  background:var(--bg);border-bottom:1px solid var(--line)}
.dlghead h2{margin:0}
#productsBody{padding:12px 16px 16px;display:flex;flex-direction:column;gap:10px}
.prodcard{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:14px;display:flex;flex-direction:column;gap:8px}
.prodcard.hl{border:2px solid var(--accent)}
.prodcard h3{margin:0;font-family:var(--display);font-size:17px}
.prodcard ul{margin:0;padding-left:18px}
.prodcard table{border-collapse:collapse;width:100%;font-size:13px}
.prodcard td{padding:3px 0;border-bottom:1px solid var(--line);vertical-align:top}
.prodcard td:last-child{text-align:right;font-family:var(--mono);white-space:nowrap;padding-left:8px}
.prodgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px}
.libgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(300px,100%),1fr));gap:10px}
.comprow.paused{opacity:.6}