:root {color-scheme:dark;--bg:#090b10;--surface:#12161f;--line:#293140;--text:#f3f4fa;--muted:#abb3c5;--accent:#899aff;--green:#4fd4a0;--orange:#ffb35b;--card-padding:24px}
*,*::before,*::after {box-sizing:border-box}
[hidden] {display:none!important}
html {background:var(--bg)}
body {margin:0;color:var(--text);background:radial-gradient(ellipse at 50% 0,#151b29 0,transparent 650px),var(--bg);font:15px/1.5 ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
button,input,textarea {font:inherit}
button {cursor:pointer;transition:background .15s,border-color .15s}
button:disabled {cursor:default;opacity:.5}
:focus-visible {outline:2px solid var(--accent);outline-offset:4px}
button:not(:disabled):hover {filter:brightness(1.12)}
h1,h2,h3,p {margin:0}
fieldset {min-width:0;margin:0;padding:0;border:0}
.shell {width:min(860px,calc(100% - 40px));margin-inline:auto;padding-block:44px 28px}
.hero {padding-bottom:28px}
h1 {font-size:clamp(28px,4vw,36px);line-height:1.12;letter-spacing:-.04em;font-weight:750;overflow-wrap:break-word}
.hero-description {margin-top:14px;color:var(--muted);font-size:15px;line-height:1.6}
.hero-description span {color:#d6ddef}
.model-info {display:flex;align-items:baseline;flex-wrap:wrap;gap:8px;margin-top:16px;color:var(--muted);font-size:12px}
.model-info strong {color:#d7deff;font-weight:600}
.scenarios {margin-bottom:30px}
.scenarios h2 {color:var(--muted);margin-bottom:12px}
.presets,.examples {display:flex;flex-wrap:wrap;gap:8px}
.presets {margin:0}
.preset,.example {max-width:100%;border:1px solid var(--line);background:#10151e;color:#d1d7e6;border-radius:99px;padding:8px 13px;font-size:12px;white-space:normal;text-align:left;overflow-wrap:anywhere}
.preset[aria-pressed="true"] {background:#8393ff;border-color:#8393ff;color:#0b1021;font-weight:650}
.example[aria-pressed="true"] {border-color:#7b8df2;background:#1b2440;color:#e1e6ff}
.section-heading {display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:5px}
h2 {font-size:12px;font-weight:750;letter-spacing:.12em}
.section-note,.section-intro p {color:var(--muted);font-size:14px}
.section-note {display:block}
.section-intro {margin-bottom:16px}
.section-intro p {margin-top:5px}
.context-input {position:relative;margin-top:12px}
textarea,input[type="text"] {display:block;width:100%;min-width:0;border:1px solid #354052;border-radius:10px;color:var(--text);background:#0d1119;padding:12px}
textarea {resize:vertical;line-height:1.6}
textarea::placeholder,input::placeholder {color:#8a95ac;opacity:1}
#context {min-height:150px;padding:16px 16px 35px;font-size:22px;font-weight:700;line-height:1.5}
.character-count {position:absolute;right:16px;bottom:11px;pointer-events:none;color:var(--muted);font-size:11px;font-variant-numeric:tabular-nums}
.toggle-grid {display:grid;grid-template-columns:minmax(0,1fr);gap:12px;margin-top:14px}
.toggle {position:relative;display:flex;align-items:flex-start;gap:12px;padding:15px;background:var(--surface);border-radius:12px;cursor:pointer;min-width:0}
.toggle>span:last-child {min-width:0}
.toggle strong {display:block;font-size:13px;line-height:1.4}
.toggle small {display:block;margin-top:4px;font-size:11px;line-height:1.45;color:var(--muted)}
.toggle input {position:absolute;width:1px;height:1px;opacity:0}
.switch {position:relative;flex:0 0 38px;width:38px;height:23px;border-radius:99px;background:#404959}
.switch::after {content:"";position:absolute;inset:3px auto auto 3px;width:17px;height:17px;border-radius:50%;background:#f4f5ff;transition:transform .15s}
.toggle input:checked+.switch {background:#6178f6}
.toggle input:checked+.switch::after {transform:translateX(15px)}
.toggle input:focus-visible+.switch {outline:2px solid var(--accent);outline-offset:4px}
.control-note {color:var(--muted);font-size:12px;margin-top:12px}
.examples-block {margin-top:20px}
.examples-label {display:block;font-size:12px;font-weight:600;margin-bottom:9px}
.analyze {display:flex;align-items:center;justify-content:center;gap:13px;width:100%;min-height:50px;padding:12px 16px;margin-top:22px;border:0;border-radius:11px;background:#5369f5;color:white;font-weight:650}
.analyze:disabled {opacity:.65}
.decisions,.performance {margin-top:36px}
.decision-card {background:linear-gradient(120deg,#151a24,#11151d);border:1px solid var(--line);border-radius:14px;padding:var(--card-padding);margin-top:12px;min-width:0}
.card-heading {display:grid;grid-template-columns:38px minmax(0,1fr) auto;align-items:center;gap:12px}
.card-heading h3 {font-size:18px;line-height:1.25;letter-spacing:-.02em}
.decision-icon {display:grid;place-items:center;width:38px;height:38px;border-radius:12px;font-size:25px}
.choice-icon {color:#a0aeff;background:#293153}
.noul-icon {color:#63dfb2;background:#183d35}
.score-icon {color:#ffba72;background:#46321f}
.edit-button,.text-button {color:#c2cbe1;border:0;background:transparent;padding:7px 0;font-size:12px;border-radius:5px}
.edit-button {padding:7px 10px;border:1px solid #354054;background:#1b2230}
.question {margin-top:16px;font-size:19px;line-height:1.5;font-weight:500;color:#e5e9f3;overflow-wrap:anywhere}
.result {margin-top:18px}
.status {color:var(--muted);font-size:12px;margin-bottom:12px}
.result[data-state="result"] .status {visibility:hidden}
.result[data-state="loading"] .status::before {display:inline-block;content:"";width:7px;height:7px;margin-right:8px;border-radius:50%;background:var(--accent);animation:pulse 1s ease-in-out infinite alternate}
@keyframes pulse {from{opacity:.35}to{opacity:1}}
.ranking {display:grid;gap:12px}
.rank-row {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr) 52px;gap:14px;align-items:center;font-size:13px}
.rank-name {min-width:0;overflow-wrap:anywhere}
.rank-percent {text-align:right;font-variant-numeric:tabular-nums;font-size:12px}
.rank-track {height:9px;background:#252e3e;border-radius:99px;overflow:hidden}
.rank-fill {display:block;height:100%;width:0;background:#8798ff;border-radius:inherit;transition:width .25s ease}
.rank-row.is-winner .rank-name {font-weight:650}
.rank-row.is-winner .rank-fill {background:#637cff}
#noulRanking .rank-fill {background:var(--green)}
#noulRanking .rank-row:last-child .rank-fill {background:#68a994}
.score-value {font-size:25px;font-weight:650;letter-spacing:-.035em;font-variant-numeric:tabular-nums;min-height:38px}
.score-scale {padding:15px 8px 30px}
/* A single padding-free rail owns EVERY horizontal score coordinate. */
.score-rail {position:relative;height:16px;padding:0;border:0}
.score-line,.score-fill {position:absolute;left:0;top:50%;height:2px;transform:translateY(-50%)}
.score-line {width:100%;background:#68758e}
.score-fill {background:var(--orange)}
#scoreTicks {display:contents}
.score-tick,.score-marker {position:absolute;top:50%;transform:translate(-50%,-50%);border-radius:50%}
.score-tick {width:10px;height:10px;border:2px solid #94a1ba;background:#12161f}
.score-number {position:absolute;top:22px;transform:translateX(-50%);font-size:11px;color:#ccd4e5}
.score-marker {width:16px;height:16px;background:var(--orange);border:2px solid #ffca8e;z-index:1}
.score-legend {display:flex;flex-wrap:wrap;gap:7px 16px;padding:0;margin:8px 0 0;list-style:none;font-size:12px;color:var(--muted)}
.score-legend li {overflow-wrap:anywhere;max-width:100%}
.score-legend b {margin-right:5px;color:#d3dbeb;font-weight:600}
.editor {margin-top:18px;padding-block:18px 6px;border-top:1px solid var(--line)}
.editor>label,.field label {display:block;color:#c3cce0;font-size:12px;margin-bottom:7px}
.editor-subhead {display:flex;justify-content:space-between;flex-wrap:wrap;gap:6px;color:var(--muted);font-size:12px;margin-block:20px 12px}
.field {min-width:0}
.editor-actions {display:flex;justify-content:flex-end;align-items:center;gap:20px;margin-top:18px}
.save-button {border:0;padding:8px 20px;border-radius:7px;background:#dae0ff;color:#151b2e;font-size:13px;font-weight:650}
.error {color:#ffb5bb;font-size:13px;overflow-wrap:anywhere;margin-top:12px}
.metrics {display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:12px}
.metric {min-width:0;background:#12161f;border:1px solid var(--line);border-radius:12px;padding:20px}
.metric-value {display:block;font-size:27px;line-height:1.2;font-weight:650;letter-spacing:-.035em;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.zero-metric .metric-value {font-size:40px;color:#dce1ff}
.metric h3 {font-size:10px;letter-spacing:.12em;color:#b3bfff;margin-top:9px}
.metric p {color:var(--muted);font-size:11px;line-height:1.55;margin-top:10px}
footer {color:#9aa5bb;font-size:10px;line-height:1.6;margin-top:28px}
.footer-meta {display:flex;justify-content:space-between;gap:16px}
.credit {margin-top:16px;font-size:12px;color:#abb3c5}
.credit a {color:#b5c1ff;text-decoration:underline;text-underline-offset:3px}
.credit a:hover {color:#e0e6ff}
footer span {min-width:0;overflow-wrap:anywhere}
.sr-only {position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@media(max-width:600px){
:root{--card-padding:18px}.shell{padding-top:28px}.hero{padding-bottom:26px}.hero h1 span{display:block}.hero-description{font-size:14px}.model-info{font-size:11px}.scenarios{margin-bottom:28px}.presets{gap:7px}.preset,.example{padding:8px 11px}.toggle-grid{grid-template-columns:minmax(0,1fr);gap:8px}.toggle{padding:14px}.card-heading{grid-template-columns:30px minmax(0,1fr) auto;gap:9px}.decision-icon{width:30px;height:30px;border-radius:9px;font-size:21px}.card-heading h3{font-size:17px}.edit-button{font-size:11px;padding:7px 8px}.question{font-size:17px}.rank-row{grid-template-columns:minmax(0,1fr) 52px;gap:6px 10px}.rank-track{grid-row:2;grid-column:1/-1}.rank-percent{grid-column:2;grid-row:1}.metrics{grid-template-columns:minmax(0,1fr)}.metric{padding:var(--card-padding)}.metric-value{font-size:26px}.zero-metric .metric-value{font-size:40px}.metric p{font-size:12px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

/* One draft item at a time. Pills wrap; the editor never becomes a form list. */
.selection-row {display:flex;flex-wrap:wrap;gap:8px;align-items:flex-start;margin-bottom:18px}
.editor-pills {display:contents}
.editor-pill,.add-pill {display:inline-flex;align-items:baseline;gap:7px;max-width:100%;padding:8px 12px;border:1px solid #354054;border-radius:99px;background:#10151e;color:#c8d1e5;font-size:12px;text-align:left;overflow-wrap:anywhere;min-width:0}
.editor-pill span {min-width:0;overflow-wrap:anywhere}
.editor-pill[aria-pressed="true"] {background:#252f52;border-color:#8194ff;color:#eef0ff}
.pill-index {flex:0 0 auto;font-weight:700;color:#b3c0ff}
.add-pill {border-style:dashed;color:#b8c5fa}
.selected-editor {padding-top:16px;border-top:1px solid var(--line)}
.selected-heading {display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;margin-bottom:12px;color:var(--muted);font-size:12px}
.selected-editor>label {display:block;margin:14px 0 7px;color:#c3cce0;font-size:12px}
.selected-editor textarea {min-height:100px}
.remove-selected {border:0;background:transparent;color:#e1a4a7;padding:5px 0;font-size:12px}
.remove-selected:disabled {opacity:.4}

@media(max-width:600px){.footer-meta{flex-direction:column;gap:5px}}

.article-link {display:inline-block;max-width:100%;margin-top:12px;color:#b5c1ff;font-size:12px;line-height:1.6;text-decoration:underline;text-underline-offset:3px;overflow-wrap:anywhere}
.article-link:hover {color:#e0e6ff}