@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');
:root{font-family:Manrope,Inter,Arial,sans-serif;color:#17372f;background:#f4f8f6}
body{background:linear-gradient(125deg,#f3f8f5 0%,#f8fbf9 58%,#eef6f1 100%)}
.app{grid-template-columns:274px minmax(0,1fr)}
aside{background:linear-gradient(160deg,#064c3e 0%,#053b34 48%,#092f2b 100%);padding:30px 18px;box-shadow:6px 0 28px #0b473615}
@media(min-width:851px){aside{position:sticky;top:0;height:100vh;overflow-y:auto;scrollbar-color:#3a7962 transparent;scrollbar-width:thin}}
.brand{font-size:20px;letter-spacing:-.05em;padding:0 8px;gap:13px}.brand small{font-size:12px;letter-spacing:0;color:#acd7c1;margin-top:5px}.logo{width:42px;height:47px;border-radius:13px 13px 19px 19px;background:linear-gradient(145deg,#3be493,#09a66d);color:#fff;box-shadow:0 7px 20px #00bd7750;transform:rotate(-5deg);transition:transform .35s ease,box-shadow .35s}.brand:hover .logo{transform:rotate(0) translateY(-3px);box-shadow:0 12px 26px #00bd7760}
.label{color:#8dbda8}.nav{gap:3px}.nav button{color:#c5e1d2;border-radius:10px;padding:10px 11px;transition:background .18s ease,transform .18s ease}.nav button:hover{background:#ffffff16;transform:translateX(3px)}.nav button.active{background:#ffffff21;color:white;font-weight:750}.nav b{color:#9dd8b6}.foot{color:#acd0bd;border-color:#ffffff25;font-size:12px}
main{background:radial-gradient(circle at 88% 7%,#dff8e9 0%,transparent 30%),linear-gradient(#f7faf8,#f5f8f6)}
header{height:76px;border-bottom:1px solid #dcece4;background:#ffffffd9;backdrop-filter:blur(12px);padding:0 42px}header strong{color:#0e4638;letter-spacing:-.02em;font-size:16px}header span{color:#5d8270}
.content{max-width:1250px;padding:34px 42px 90px}.modebar{border-color:#d7e9dd;gap:14px;margin-bottom:31px}.modebar button{font-weight:750;color:#658473;transition:color .2s,border-color .2s}.modebar button.active{color:#08754e;border-color:#15b76e}.modebar button:hover{color:#078456}
.eyebrow{color:#139867}.eyebrow:before{content:'';display:inline-block;width:8px;height:8px;background:#29c579;border-radius:50%;margin-right:8px;box-shadow:0 0 0 5px #dff8e9;vertical-align:1px}
h1{color:#093e31;font-size:clamp(29px,3vw,41px);letter-spacing:-.05em;margin:9px 0 7px}h2{color:#174638;letter-spacing:-.03em}.source-note{max-width:760px;line-height:1.6;color:#688777}.source-note a{color:#0b8d59;font-weight:700}
.search{max-width:920px;margin:23px 0 13px}.search input{height:64px;border:1px solid #cfe6d9;border-radius:15px;box-shadow:0 9px 27px #0d5f3b0d;background:#fff;color:#173d31;font-size:16px;transition:box-shadow .22s,border-color .22s}.search input:focus{border-color:#17a86e;box-shadow:0 0 0 4px #d9f5e7,0 12px 28px #0c6a4222}.search:before{color:#189668;top:14px}.search input::placeholder{color:#829b8c}
.grid{gap:14px}.tile{border-color:#dcece2;border-radius:17px;min-height:151px;box-shadow:0 5px 18px #154d3408;position:relative;overflow:hidden;transition:transform .25s,border-color .25s,box-shadow .25s}.tile:after{content:'↗';position:absolute;right:17px;top:16px;color:#8dbca4;font-size:21px;opacity:0;transform:translate(-5px,5px);transition:opacity .25s,transform .25s}.tile:hover{transform:translateY(-4px);border-color:#6bcda0;box-shadow:0 14px 30px #0f70431b;background:white}.tile:hover:after{opacity:1;transform:translate(0,0)}.tile i{background:#e3f8ec;color:#168957;border-radius:11px;width:39px;height:39px;transition:transform .35s,background .35s}.tile:hover i{transform:rotate(-10deg) scale(1.12);background:#c5f3d8}.tile strong{color:#164939;line-height:1.4}.tile small{color:#779786}
.official-card,.rows,.detail{border-color:#dbece1;border-radius:16px;box-shadow:0 8px 26px #205a3c0a}.official-row{display:flex;align-items:center;gap:12px;justify-content:space-between;transition:background .18s}.official-row:hover{background:#f5fbf7}.official-row a{color:#214c3a;font-weight:650}.official-row a:hover{color:#0b9a5a}.official-row small{color:#7e9b89}.official-count{color:#658772}.link-copy{flex:none;border:1px solid #d6eadc;background:#f7fbf8;color:#2c7451;border-radius:9px;width:34px;height:34px;display:grid;place-items:center;font-size:16px;transition:transform .18s,background .18s}.link-copy:hover{background:#daf6e6;transform:translateY(-2px)}.link-copy:focus-visible,.tile:focus-visible,.modebar button:focus-visible,.nav button:focus-visible{outline:3px solid #12b473;outline-offset:2px}.more-cats{margin:16px 0 2px;border:0;background:#e5f7ec;color:#0b7e50;border-radius:10px;padding:11px 16px;font-size:14px;font-weight:750}.more-cats:hover{background:#cff1dc}
.row{border-color:#e7f0e9}.row:hover{background:#f6fbf7}.row strong,.detail h1{color:#114935}.row small,.meta{color:#769382}.row em{color:#2da978}.detail p,.detail li{color:#385e49}.reply{background:#eff9f2;border-color:#16b46c}.back,.copy,.detail a{color:#0b8755}.caution{color:#6e8b77}.menu{color:#0e6040}
.audit{display:inline-flex;align-items:center;gap:8px;background:#e4f7eb;border:1px solid #ccebd7;border-radius:999px;padding:7px 12px;color:#20744d;font-size:12px;font-weight:700;margin-top:3px}.audit svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2}
@media(max-width:850px){aside{box-shadow:16px 0 40px #092f2b33}header{padding:0 20px}.content{padding:26px 20px 60px}}
@media(max-width:540px){.tile{min-height:135px}.official-row{align-items:flex-start}.link-copy{margin-top:2px}.modebar{gap:0;justify-content:space-between}.modebar button{padding:0 4px 12px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
.tile:nth-child(3n+1) i{animation:icon-breathe 4.4s ease-in-out infinite}.tile:nth-child(3n+2) i{animation:icon-breathe 4.4s ease-in-out 1.1s infinite}.tile:nth-child(3n) i{animation:icon-breathe 4.4s ease-in-out 2.2s infinite}.tile:hover i{animation-play-state:paused}@keyframes icon-breathe{0%,100%{box-shadow:0 0 0 0 #19b87500}50%{box-shadow:0 0 0 5px #19b87518}}
[hidden]{display:none!important}
.nav-toggle{width:100%;display:flex;justify-content:space-between;align-items:center;border:0;background:transparent;text-align:left;cursor:pointer}.nav-toggle .chevron{font-size:20px;line-height:1;transition:transform .25s}.nav-toggle[aria-expanded="false"] .chevron{transform:rotate(-90deg)}
.welcome{position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(108deg,#073e34,#087755 67%,#10a66e);border-radius:23px;padding:30px 34px 28px;margin-bottom:25px;color:white;box-shadow:0 18px 38px #07523a25}.welcome:before{content:'';position:absolute;z-index:-1;width:380px;height:380px;border:1px solid #ffffff2b;border-radius:50%;right:-70px;top:-270px;box-shadow:0 0 0 38px #ffffff09,0 0 0 79px #ffffff07;animation:orbit 11s ease-in-out infinite alternate}.welcome:after{content:'';position:absolute;z-index:-1;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,#83f8b850,transparent 67%);right:5%;bottom:-180px;animation:glow-drift 7s ease-in-out infinite alternate}.welcome .eyebrow{color:#a7f1c4}.welcome .eyebrow:before{background:#a1f5bc;box-shadow:0 0 0 5px #ffffff20}.welcome h1{color:white;font-size:clamp(26px,3vw,39px);line-height:1.2;max-width:780px}.welcome .source-note{color:#d9f5e4;margin:10px 0 16px}.welcome .source-note a{color:white;text-decoration:underline;text-underline-offset:3px}.welcome .audit{background:#ffffff1f;color:#e9fff0;border-color:#ffffff35;backdrop-filter:blur(5px)}
@keyframes orbit{to{transform:translate(-33px,25px) rotate(14deg)}}@keyframes glow-drift{to{transform:translate(-35px,-35px) scale(1.12)}}
.modebar button{position:relative}.modebar button.active:after{content:'';position:absolute;left:20%;right:20%;bottom:-3px;height:3px;background:#4ce89a;box-shadow:0 0 14px #20d482;animation:tab-glow 2.6s ease-in-out infinite alternate}@keyframes tab-glow{to{opacity:.45;box-shadow:0 0 4px #20d482}}
@media(max-width:540px){.welcome{padding:24px 20px;border-radius:17px}.welcome h1{font-size:26px}.welcome:before{right:-220px}.welcome .audit{font-size:11px}}
/* Readable reference layout */
:root{--green:#087653;--ink:#153f32;--muted:#718b7f;--line:#deebe3}
body{background:#f5f8f6}main{background:#f5f8f6}
.content{max-width:1180px;padding:30px 38px 80px}
header{height:70px}.modebar{margin-bottom:26px;gap:28px}.modebar button{padding-bottom:15px}.modebar button.active:after{animation:none;box-shadow:none;left:0;right:0;background:#16b674}
.welcome{border-radius:20px;padding:28px 30px;margin-bottom:25px;background:linear-gradient(115deg,#064c3e,#078257);box-shadow:0 12px 28px #07523a14}.welcome:before,.welcome:after{animation:none}.welcome h1{font-size:clamp(28px,3vw,38px);margin-top:13px}.welcome .source-note{max-width:570px;line-height:1.65}.welcome .audit{font-weight:500;font-size:12px}
.search{max-width:none;margin-bottom:24px}.search input{height:60px;border-radius:13px;box-shadow:0 4px 16px #154d3406}
h2{font-size:18px;margin:24px 0 15px}.grid{gap:12px}.tile{min-height:148px;padding:19px;border-radius:14px;box-shadow:none}.tile i{animation:none!important;width:35px;height:35px;font-size:12px;font-weight:800;border-radius:10px;margin-bottom:15px}.tile:hover i{transform:none}.tile:after{display:none}.tile:hover{transform:translateY(-2px);box-shadow:0 8px 20px #0f704312}.tile strong{font-size:14px}.tile small{display:flex;justify-content:space-between;align-items:center}.tile small span{color:#17865b;font-size:19px}.more-cats{background:white;border:1px solid var(--line);margin-top:14px;font-size:13px}
.official-count{font-size:13px;font-weight:700;margin:30px 0 12px}.official-card{overflow:hidden;background:white;border:1px solid var(--line);box-shadow:0 6px 22px #205a3c05}
.official-row{width:100%;background:white;border:0;border-bottom:1px solid #e8efe9;text-align:left;padding:22px 24px;gap:18px;display:flex;align-items:center;justify-content:space-between;color:var(--ink);transition:background .18s}.official-row:last-child{border-bottom:0}.official-row:hover{background:#f2faf5}.official-row .question-text{min-width:0;display:block}.official-row small{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.055em;margin-bottom:7px;color:#7b9687}.official-row strong{display:block;font-size:16px;font-weight:700;line-height:1.5}.answer-preview{display:block;font-size:13px;line-height:1.55;color:#83948c;margin-top:7px}.row-arrow{width:34px;height:34px;flex:none;display:grid;place-items:center;border-radius:50%;background:#eef7f1;color:#18865c;font-size:18px}.official-row:focus-visible{outline:3px solid #17ad71;outline-offset:-3px}
.detail{border-radius:20px;padding:32px 36px;background:white;max-width:850px;margin:0 auto}.detail .back{display:inline-block;margin-bottom:29px;padding:0;background:none;border:0;font-size:13px;font-weight:650}.detail h1{font-size:clamp(25px,3vw,34px);line-height:1.3;margin:15px 0 18px;letter-spacing:-.035em;overflow-wrap:anywhere}.article-meta{display:flex;gap:13px;flex-wrap:wrap;color:#7c9285;font-size:12px;padding-bottom:24px;border-bottom:1px solid #e6eee8;margin-bottom:25px}.article-meta span:first-child{color:#168353}.answer-body p{font-size:17px;line-height:1.9;color:#355548;margin:0 0 21px;white-space:pre-line;overflow-wrap:anywhere}.article-footer{border-top:1px solid #e6eee8;margin-top:32px;padding-top:20px;display:flex;gap:16px;align-items:center;justify-content:space-between}.article-footer>span{font-size:11px;line-height:1.65;color:#81988b;max-width:260px}.article-footer .copy{border:1px solid #d4e9dd;border-radius:10px;padding:11px 14px;background:#f2faf5;font-size:12px;font-weight:700;flex:none}.empty{padding:35px;color:#6b8877;text-align:center}
.logo{transform:none;box-shadow:none}.brand:hover .logo{transform:none}.nav button:hover{transform:none}
@media(max-width:850px){.content{padding:24px 20px 60px}.detail{padding:27px 25px}header{padding:0 20px}}
@media(max-width:540px){.content{padding:20px 16px 50px}.welcome{padding:25px 22px}.welcome h1{font-size:29px}.welcome .source-note{font-size:14px}.welcome .audit{font-size:10px}.modebar{gap:15px}.modebar button{font-size:13px;padding:0 0 14px}.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.tile{min-height:150px;padding:16px}.tile strong{font-size:13px}.tile small{font-size:11px}.official-row{padding:19px 18px;gap:12px}.official-row strong{font-size:15px}.answer-preview{font-size:12px}.row-arrow{width:28px;height:28px;font-size:16px}.detail{padding:24px 21px}.detail h1{font-size:27px}.answer-body p{font-size:16px;line-height:1.85}.article-footer{align-items:flex-start;flex-direction:column}.article-footer>span{max-width:none}.search input{font-size:15px}.official-count{margin-top:26px}}
