*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;color:#182230;background:#f6f8fb;line-height:1.55}
.topbar{height:72px;background:#fff;border-bottom:1px solid #e5e9ef;display:flex;align-items:center;justify-content:space-between;padding:0 6%;position:sticky;top:0;z-index:20}
.brand{display:flex;align-items:center;gap:12px}.brand-mark{width:38px;height:38px;border-radius:10px;background:#182230;color:#fff;display:grid;place-items:center;font-weight:800}.brand strong,.brand span{display:block}.brand span{font-size:11px;color:#6b7280}
.topbar nav{display:flex;gap:20px}.topbar a{color:#445064;text-decoration:none;font-size:14px}.topbar a:hover{color:#182230}
.hero{max-width:1180px;margin:0 auto;padding:76px 28px 48px;display:grid;grid-template-columns:1.45fr .8fr;gap:44px;align-items:center}
.eyebrow{font-size:11px;letter-spacing:.13em;font-weight:800;color:#64748b;margin:0 0 10px}.hero h1{font-size:clamp(38px,5vw,64px);line-height:1.02;letter-spacing:-.04em;margin:0 0 22px}.hero h1 span{color:#536173}.hero-text{font-size:18px;max-width:760px;color:#536173}
.hero-actions,.paper-actions{display:flex;gap:12px;margin-top:28px;flex-wrap:wrap}.button{display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:9px;padding:11px 17px;font-weight:700;text-decoration:none;cursor:pointer;font-size:14px}.primary{background:#182230;color:#fff}.secondary{background:#fff;color:#182230;border:1px solid #d8dee8}
.principle-card{background:#182230;color:#fff;border-radius:18px;padding:28px;box-shadow:0 18px 45px rgba(15,23,42,.13)}.principle-title{font-size:12px;text-transform:uppercase;letter-spacing:.12em;opacity:.65}.flow{display:flex;align-items:center;gap:8px;margin:18px 0 12px;flex-wrap:wrap}.flow span{background:#2c3747;padding:8px 11px;border-radius:8px;font-weight:700;font-size:12px}.flow b{opacity:.6}.principle-card p{color:#cbd5e1;font-size:14px}
.stats{max-width:1124px;margin:0 auto 55px;display:grid;grid-template-columns:repeat(4,1fr);background:#fff;border:1px solid #e5e9ef;border-radius:14px;overflow:hidden}.stats div{padding:20px 24px;border-right:1px solid #e5e9ef}.stats div:last-child{border-right:0}.stats strong,.stats span{display:block}.stats strong{font-size:23px}.stats span{font-size:12px;color:#6b7280}
.section{max-width:1124px;margin:0 auto;padding:50px 0}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:24px}.section-heading h2,.paper-banner h2{font-size:30px;letter-spacing:-.025em;margin:0}
.filters{display:grid;grid-template-columns:1fr 210px 210px;gap:10px;margin-bottom:20px}.filters input,.filters select{background:#fff;border:1px solid #d8dee8;border-radius:9px;padding:11px 13px;font:inherit;color:#182230}.filters input{min-width:0}
.problem-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.problem-card{background:#fff;border:1px solid #e1e6ed;border-radius:14px;padding:22px;cursor:pointer;transition:.18s}.problem-card:hover{transform:translateY(-2px);box-shadow:0 10px 25px rgba(15,23,42,.07)}
.problem-id{font-size:12px;font-weight:800;color:#64748b}.problem-card h3{font-size:19px;line-height:1.3;margin:8px 0}.problem-card p{color:#596579;font-size:14px}.tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:14px}.tag{font-size:11px;padding:4px 8px;border-radius:999px;background:#eef2f7;color:#4b5563}.tag.verified{background:#e7f5ec;color:#23713f}.tag.community{background:#eef4ff;color:#315eaa}
.module-section{border-top:1px solid #e2e7ee}.module-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.module-card{background:#fff;border:1px solid #e1e6ed;border-radius:13px;padding:20px}.module-icon{width:36px;height:36px;border-radius:9px;background:#eef2f7;display:grid;place-items:center;font-weight:800;margin-bottom:12px}.module-card h3{margin:0 0 7px}.module-card p{font-size:13px;color:#637083;margin:0}
.how{border-top:1px solid #e2e7ee}.how-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.how-grid article{background:#fff;border:1px solid #e1e6ed;border-radius:13px;padding:20px}.step{font-size:12px;font-weight:800;color:#64748b}.how-grid h3{margin:7px 0}.how-grid p{font-size:13px;color:#637083}
.paper-banner{max-width:1124px;margin:20px auto 70px;background:#182230;color:#fff;border-radius:18px;padding:30px;display:flex;align-items:center;justify-content:space-between;gap:20px}.paper-banner p{color:#cbd5e1}.paper-banner .secondary{background:#fff}
.modal{position:fixed;inset:0;background:rgba(15,23,42,.58);display:none;align-items:center;justify-content:center;padding:20px;z-index:50}.modal.open{display:flex}.modal-panel{position:relative;width:min(620px,100%);max-height:90vh;overflow:auto;background:#fff;border-radius:16px;padding:28px}.modal-panel.large{width:min(980px,100%)}.close{position:absolute;right:14px;top:10px;border:0;background:transparent;font-size:28px;color:#64748b;cursor:pointer}
.detail-head{padding-right:30px;border-bottom:1px solid #e6eaf0;padding-bottom:18px}.detail-head h2{font-size:28px;line-height:1.2;margin:5px 0 10px}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:20px}.detail-box{border:1px solid #e1e6ed;border-radius:12px;padding:16px}.detail-box h4{margin:0 0 7px;font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:#64748b}.detail-box p{margin:0;font-size:14px}.detail-box a{color:#315eaa}.full{grid-column:1/-1}
.action-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:16px}.action-card{background:#fff;border:1px solid #dbe1e9;border-radius:11px;padding:14px;text-align:left;cursor:pointer;display:grid;grid-template-columns:34px 1fr;column-gap:10px}.action-card strong{font-size:14px}.action-card small{grid-column:2;color:#6b7280;font-size:12px}.action-icon{grid-row:1/3;display:grid;place-items:center;width:32px;height:32px;border-radius:8px;background:#eef2f7;font-weight:800}
.vote-summary{display:flex;gap:12px;flex-wrap:wrap;margin-top:13px;padding:11px 13px;background:#f6f8fb;border-radius:9px;font-size:12px}.proposal-list{display:grid;gap:10px;margin-top:14px;border-top:1px solid #e6eaf0;padding-top:15px;font-size:13px}.proposal-card{border:1px solid #e1e6ed;border-radius:11px;padding:14px;background:#fbfcfe}.proposal-top{display:flex;justify-content:space-between;align-items:center;gap:10px}.proposal-index{font-size:11px;color:#7a8493}.proposal-card p{margin:10px 0;font-size:14px}.proposal-actions{display:flex;flex-wrap:wrap;gap:7px}.mini-button{border:1px solid #d3dae4;background:#fff;border-radius:8px;padding:7px 10px;cursor:pointer;font-size:12px;font-weight:700}.mini-button:hover{border-color:#8793a3;background:#f8fafc}
.join-row{display:flex;gap:9px;flex-wrap:wrap;margin-top:12px}.notice{background:#f4f6f9;border-radius:9px;padding:10px 12px;font-size:12px;color:#596579;margin-top:12px}
form{display:grid;gap:14px;margin-top:20px}label{font-size:13px;font-weight:700;display:grid;gap:6px}label input,label textarea,label select{font:inherit;font-weight:400;border:1px solid #d8dee8;border-radius:9px;padding:10px 12px;background:#fff}textarea{min-height:110px;resize:vertical}.muted{color:#697586;font-size:14px}.empty{padding:40px;text-align:center;background:#fff;border:1px dashed #cfd6df;border-radius:12px;color:#687386}
footer{border-top:1px solid #e2e7ee;background:#fff;padding:22px 6%;display:flex;justify-content:space-between;gap:20px;font-size:12px;color:#697586}footer a{color:#315eaa}
@media(max-width:900px){.topbar{padding:0 18px}.topbar nav{display:none}.hero{grid-template-columns:1fr;padding:48px 18px 30px}.stats{margin:0 18px 30px;grid-template-columns:repeat(2,1fr)}.stats div:nth-child(2){border-right:0}.section{padding:35px 18px}.problem-grid,.module-grid,.how-grid{grid-template-columns:1fr}.filters{grid-template-columns:1fr}.section-heading{align-items:start;flex-direction:column}.paper-banner{margin:20px 18px 45px;flex-direction:column;align-items:start}.detail-grid{grid-template-columns:1fr}.full{grid-column:auto}footer{padding:20px 18px;flex-direction:column}}
