← Files Vibe CodingARCHIVED FILE

assets/catalog/style.css

7.26 KB · Oct 3, 2026 · 06:36 UTC

↓ Download file

:root{color-scheme:dark;--bg:#101212;--panel:#191c1b;--line:#303733;--text:#f0f4ed;--muted:#a5b1a8;--accent:#c3f078;--mono:ui-monospace,SFMono-Regular,Consolas,monospace}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:16px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}button,input,select{font:inherit}button,a,input,select{touch-action:manipulation}button{cursor:pointer}a{color:var(--accent)}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid var(--accent);outline-offset:4px}header{max-width:1440px;margin:auto;padding:28px 44px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{font:600 15px var(--mono);letter-spacing:.1em;display:flex;gap:12px;align-items:center}.mark{width:30px;height:30px;background:var(--accent);color:#132010;display:grid;place-content:center;border-radius:8px;font-size:20px}.version{color:var(--muted);font:12px var(--mono)}main{max-width:1440px;margin:auto;padding:52px 44px}.eyebrow{font:12px var(--mono);letter-spacing:.1em;color:var(--accent);text-transform:uppercase}h1{font-size:clamp(34px,4.5vw,66px);line-height:1.08;letter-spacing:-.045em;font-weight:600;margin:20px 0 24px;max-width:850px}h1 span{color:var(--accent)}.intro{color:var(--muted);max-width:650px;font-size:17px;margin:0}.hero{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;margin-bottom:44px}.stats{display:flex;gap:28px;flex-shrink:0}.stat strong{display:block;font:36px var(--mono);letter-spacing:-.05em}.stat span{font-size:12px;color:var(--muted)}.starter{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 32px}.starter button{border:1px solid var(--line);border-radius:30px;padding:8px 14px;background:transparent;color:var(--text);font-size:13px}.starter button:hover{border-color:var(--accent);background:#202719}.tools{display:grid;grid-template-columns:minmax(200px,1fr) 270px 210px;gap:12px}.tools label{font:11px var(--mono);color:var(--muted);text-transform:uppercase;letter-spacing:.06em}.tools input,.tools select{display:block;margin-top:8px;width:100%;background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:10px;height:48px;padding:0 14px;font-size:14px}.resultbar{display:flex;justify-content:space-between;align-items:center;margin:24px 0 12px;color:var(--muted);font:12px var(--mono)}.resultbar button{background:transparent;color:var(--accent);border:0;padding:6px}.rows{border-top:1px solid var(--line)}.row{display:grid;grid-template-columns:42px minmax(220px,1fr) 210px 136px 24px;gap:16px;align-items:center;width:100%;text-align:left;border:0;border-bottom:1px solid var(--line);padding:19px 8px;background:none;color:var(--text);min-height:92px}.row:hover{background:#1c211c}.num{font:11px var(--mono);color:#8c9b8f}.title{display:block;font-size:16px;font-weight:550;letter-spacing:-.01em}.skill{display:block;font:11px var(--mono);color:var(--muted);margin-top:5px}.category{font-size:12px;color:var(--muted)}.badge{justify-self:start;border:1px solid #3c4935;color:#c8d5c0;background:#20271e;padding:4px 9px;border-radius:6px;font-size:11px;white-space:nowrap}.badge.audit,.badge.review{color:#c6d7f7;background:#1c2532;border-color:#33425b}.badge.check{color:#e7d2a6;background:#2e281c;border-color:#55482a}.arrow{color:var(--muted);font-size:20px}.empty{border:1px dashed var(--line);padding:40px;text-align:center;color:var(--muted);margin-top:16px;border-radius:12px}footer{display:flex;gap:22px;flex-wrap:wrap;margin-top:38px;padding-top:22px;border-top:1px solid var(--line);font-size:12px;color:var(--muted)}footer a{color:var(--muted)}dialog{width:min(850px,calc(100% - 28px));max-height:88vh;border:1px solid #536248;background:#171b18;color:var(--text);padding:32px;border-radius:18px;box-shadow:0 30px 100px #0008}dialog::backdrop{background:#000b;backdrop-filter:blur(5px)}.dialogtop{display:flex;justify-content:space-between;align-items:center;gap:20px}.close{border:1px solid var(--line);border-radius:50%;background:transparent;color:var(--text);font-size:23px;width:38px;height:38px}dialog h2{font-size:28px;letter-spacing:-.03em;margin:25px 0 12px}.detailmeta{color:var(--muted);font-size:13px}.prompt{width:100%;resize:vertical;min-height:108px;background:#10150f;color:var(--text);border:1px solid var(--line);border-radius:10px;padding:15px;font:14px/1.6 var(--mono);margin-top:18px}.actions{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin:14px 0 20px}.copy{background:var(--accent);color:#15200e;border:0;padding:12px 18px;border-radius:8px;font-weight:650}.status{font-size:12px;color:var(--accent)}details{border-top:1px solid var(--line);padding-top:18px}summary{cursor:pointer;color:var(--muted);font-size:13px}pre{white-space:pre-wrap;overflow-wrap:anywhere;font:12px/1.7 var(--mono);color:#c6d0c7}.source{color:var(--muted);font-size:11px;overflow-wrap:anywhere;margin-top:22px}.help{font-size:12px;color:var(--muted)}@media(max-width:1000px){.hero{display:block}.stats{margin-top:28px}.tools{grid-template-columns:1fr 1fr}.tools label:first-child{grid-column:1/-1}.row{grid-template-columns:30px 1fr 115px 20px}.category{display:none}}@media(max-width:600px){header{padding:20px}.version{display:none}main{padding:32px 20px}.hero{margin-bottom:30px}h1{font-size:40px}.intro{font-size:15px}.tools{grid-template-columns:1fr}.tools label:first-child{grid-column:auto}.row{grid-template-columns:1fr 100px;padding:16px 0;gap:8px}.num,.arrow{display:none}.title{font-size:14px}.badge{font-size:10px;justify-self:end}.skill{font-size:10px}.stats{gap:24px}.stat strong{font-size:30px}dialog{padding:22px}.dialogtop{gap:8px}dialog h2{font-size:23px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
.header-actions{display:flex;align-items:center;gap:24px}.language-label{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:12px}.language-label select{max-width:150px;min-height:40px;padding:7px 28px 7px 10px;border:1px solid var(--line);border-radius:8px;background:var(--panel);color:var(--text);font-size:13px}.headline{color:var(--text)}.site-links{display:flex;gap:20px;flex-wrap:wrap;margin:0 0 24px;font-size:14px}.name{min-width:0}.title,.category{overflow-wrap:anywhere}.row{grid-template-columns:42px minmax(0,1fr) 200px 136px 24px}.badge{white-space:normal;overflow-wrap:anywhere}.prompt{min-height:145px}.close{flex-shrink:0}.policy{max-width:800px;padding-top:40px}.policy h1{font-size:42px;letter-spacing:-.025em}.policy p{font-size:16px;line-height:1.8;overflow-wrap:anywhere}.policy> a{font-size:14px}.brand{text-decoration:none;color:var(--text)}
@media(max-width:1000px){.header-actions{gap:16px}.version{display:none}.row{grid-template-columns:30px minmax(0,1fr) 115px 20px}}
@media(max-width:600px){header{flex-wrap:wrap;gap:16px;padding:18px 20px}.brand{font-size:13px;gap:8px}.header-actions{margin-left:auto}.language-label{gap:6px}.language-label>span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.language-label select{max-width:118px;padding-right:20px}.row{grid-template-columns:minmax(0,1fr) 90px}.stats{gap:20px;flex-wrap:wrap}.stat{max-width:110px}.stat span{display:block}.resultbar{gap:12px;align-items:flex-start}.resultbar button{flex-shrink:0}.hero h1{font-size:36px;overflow-wrap:anywhere}.policy h1{font-size:34px}}

SHA-256: adede892e2dc4f9d73ab1cd6218ba3f8be69339364849ca747cbe577a1b2ac94