:root { --ink:#17221d; --muted:#68736c; --line:#dbe2db; --paper:#fcfcf9; --green:#1e5b43; --lime:#d9f167; --panel:#f1f4ef; }
* { box-sizing:border-box; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Manrope,Arial,sans-serif; }
.shell { max-width:1180px; margin:0 auto; padding:28px 36px 80px; }
.topbar { display:flex; justify-content:space-between; align-items:center; }
.brand { color:var(--ink); text-decoration:none; font-weight:700; font-size:20px; letter-spacing:-.8px; display:flex; align-items:center; gap:8px; }.brand-mark { display:grid; place-items:center; width:26px; height:26px; background:var(--green); color:var(--lime); border-radius:50%; font-family:Georgia,serif; font-size:16px; }
.status { font:12px "DM Mono",monospace; color:var(--green); border:1px solid #c8dacd; border-radius:20px; padding:7px 10px; }.status i { display:inline-block; width:7px; height:7px; border-radius:50%; background:#52a675; margin-right:7px; }
.intro-panel { margin:54px 0 36px; max-width:860px; border-left:3px solid var(--green); padding-left:20px; }.eyebrow { color:var(--green); font:11px "DM Mono",monospace; letter-spacing:1.35px; margin:0 0 15px; }
h1,h2,p { margin-top:0; } h1 { font-size:32px; line-height:1.18; letter-spacing:-1.6px; margin-bottom:14px; font-weight:650; }.intro { color:var(--muted); line-height:1.65; max-width:810px; font-size:14px; }
.workspace { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(260px,.8fr); border:1px solid var(--line); }.request-card { padding:38px; border-right:1px solid var(--line); }.form-heading { display:flex; gap:16px; margin-bottom:34px; }.step { color:var(--green); font:12px "DM Mono",monospace; padding-top:4px; } h2 { font-size:23px; letter-spacing:-1px; margin-bottom:4px; }.form-heading p { color:var(--muted); font-size:13px; margin:0; }
label { font-size:12px; font-weight:700; display:block; margin:21px 0 8px; } label span { color:var(--muted); font-weight:500; margin-left:5px; } input,textarea { appearance:none; width:100%; border:1px solid #ccd6cc; border-radius:3px; background:#fff; color:var(--ink); font:14px Manrope,sans-serif; padding:13px 14px; outline:none; transition:border .2s,box-shadow .2s; } textarea { min-height:92px; resize:vertical; } input:focus,textarea:focus { border-color:var(--green); box-shadow:0 0 0 3px #e2eee5; } button { cursor:pointer; font-family:inherit; } #run-button { display:flex; align-items:center; justify-content:space-between; width:100%; margin-top:23px; border:0; background:var(--green); color:white; padding:15px 17px; font-weight:700; font-size:14px; transition:transform .2s,background .2s; } #run-button:hover { background:#174634; transform:translateY(-1px); }.arrow { font-size:19px; line-height:12px; }.privacy { color:#829087; font-size:11px; line-height:1.6; margin:15px 0 0; }
.how-it-works { padding:40px 32px; background:var(--panel); }.how-it-works ol { padding:0; margin:28px 0 0; list-style:none; }.how-it-works li { display:flex; gap:13px; padding:0 0 27px; position:relative; }.how-it-works li:not(:last-child)::after { content:""; position:absolute; top:24px; bottom:0; left:8px; width:1px; background:#c8d2c9; }.how-it-works li>span { width:17px; height:17px; border:1px solid #94a99c; border-radius:50%; text-align:center; font:8px/15px "DM Mono",monospace; color:var(--green); flex:0 0 auto; }.how-it-works strong { font-size:13px; }.how-it-works li p { color:var(--muted); margin:4px 0 0; font-size:12px; line-height:1.55; }
.output-section { margin-top:54px; border-top:1px solid var(--ink); padding-top:23px; }.output-heading { display:flex; align-items:flex-end; justify-content:space-between; }.output-heading .eyebrow { margin-bottom:8px; }.output-heading h2 { margin:0; }.copy-button { background:transparent; border:1px solid var(--line); padding:9px 12px; color:var(--ink); font-size:12px; }.copy-button:hover { border-color:var(--green); color:var(--green); }.run-status { display:flex; gap:12px; align-items:center; flex-wrap:wrap; margin:20px 0 12px; }.run-meta { color:var(--muted); font:11px "DM Mono",monospace; }.model-name { color:#365548; font:11px "DM Mono",monospace; padding-left:12px; border-left:1px solid var(--line); }.elapsed-time { color:var(--green); font:11px "DM Mono",monospace; padding-left:12px; border-left:1px solid var(--line); }.elapsed-time::before { content:""; display:inline-block; width:6px; height:6px; margin-right:6px; border-radius:50%; background:#52a675; animation:pulse 1.1s infinite; }@keyframes pulse { 50% { opacity:.25; } }.report-output { min-height:92px; padding:28px; border:1px solid var(--line); background:#fff; color:var(--ink); font-size:14px; line-height:1.7; }.report-output h2 { font-size:25px; margin:0 0 20px; letter-spacing:-.9px; }.report-output h3 { font-size:16px; margin:27px 0 9px; }.report-output p { margin:0 0 12px; }.report-output ul { margin:0 0 16px; padding-left:21px; }.report-output li { margin:6px 0; }.report-output a { color:var(--green); text-decoration:underline; text-underline-offset:2px; }.report-output hr { border:0; border-top:1px solid var(--line); margin:23px 0; }.inline-value { color:#385245; font-weight:600; }.report-quote { margin:0 0 14px; padding:11px 13px; border-left:3px solid #b8d0bf; background:var(--panel); color:#46564c; }.table-wrap { overflow-x:auto; margin:0 0 18px; border:1px solid var(--line); }.report-output table { width:100%; border-collapse:collapse; min-width:540px; font-size:12px; line-height:1.55; }.report-output th { background:var(--panel); text-align:left; font-size:11px; color:#365548; }.report-output th,.report-output td { padding:10px 11px; vertical-align:top; border-bottom:1px solid var(--line); }.report-output tbody tr:last-child td { border-bottom:0; }.report-message { color:var(--muted); font-size:14px; }
.previous-notice { display:flex; align-items:center; justify-content:space-between; gap:18px; border:1px solid #d0dcb8; background:#f7fae9; padding:15px 17px; margin:18px 0; }.previous-notice strong { font-size:13px; }.previous-notice p { margin:3px 0 0; color:var(--muted); font-size:12px; }.previous-notice button { flex:0 0 auto; border:0; background:var(--ink); color:white; padding:10px 13px; font-size:12px; font-weight:700; }
.previous-notice[hidden], .output-section[hidden] { display:none; }
.auth-page { min-height:100vh; display:grid; place-items:center; padding:24px; background:var(--panel); }.auth-shell { width:min(100%, 440px); }.auth-card { padding:38px; border:1px solid var(--line); background:#fff; }.auth-card .brand { display:inline-flex; margin-bottom:42px; }.auth-card h1 { margin:5px 0 10px; }.auth-card form { margin-top:27px; }.auth-card label { display:block; margin:17px 0 7px; font-size:12px; font-weight:700; }.auth-card input { width:100%; box-sizing:border-box; padding:12px; border:1px solid var(--line); font:inherit; }.auth-card button { width:100%; margin-top:24px; }.form-error { margin:14px 0 0; color:#a33a30; font-size:13px; }
.session-controls { display:flex; align-items:center; gap:12px; }.text-button { border:0; background:none; color:var(--muted); padding:4px; font-size:12px; }.text-button:hover { color:var(--green); }.admin-section { margin:0 0 32px; padding:25px; border:1px solid var(--line); background:#fff; }.admin-section[hidden] { display:none; }.admin-section h2 { margin:0 0 18px; }.user-form { display:grid; grid-template-columns:2fr 1fr 2fr auto; gap:10px; align-items:end; margin:0 0 22px; }.user-form label { display:block; font-size:11px; font-weight:700; }.user-form input,.user-form select { box-sizing:border-box; width:100%; margin-top:6px; padding:9px; border:1px solid var(--line); background:#fff; font:inherit; }.user-form button { padding:10px 14px; }.user-form .form-error { grid-column:1 / -1; margin:0; }.user-action { margin:0 3px 3px 0; padding:5px 7px; border:1px solid var(--line); background:#fff; font-size:11px; }.user-action:hover { border-color:var(--green); color:var(--green); }
@media (max-width:700px) { .shell { padding:22px 18px 48px; }.intro-panel { margin:42px 0 28px; } h1 { letter-spacing:-1.2px; }.workspace { grid-template-columns:1fr; }.request-card { border-right:0; border-bottom:1px solid var(--line); padding:28px 20px; }.how-it-works { padding:28px 20px; }.output-heading { align-items:start; gap:16px; }.previous-notice { align-items:flex-start; flex-direction:column; }.report-output { padding:20px 16px; font-size:13px; } }
