
:root{--ink:#1d1b3a;--muted:#55557a;--bg:#f6f2ea;--paper:#fffdf8;--accent:#6A3FD4;--gold:#f2b705;--fs:1rem;--r:18px}
*{box-sizing:border-box}
html{font-size:calc(16px * var(--zoom,1))}
body{margin:0;font-family:"Rubik","Heebo","Assistant","Segoe UI",Arial,sans-serif;color:var(--ink);background:var(--bg);background-image:radial-gradient(circle at 10% 0,#ffe9c7 0,transparent 40%),radial-gradient(circle at 100% 30%,#e7defc 0,transparent 35%),radial-gradient(circle at 0 100%,#d3f4ec 0,transparent 35%);background-attachment:fixed;line-height:1.6}
a{color:#4b2bb0}
:focus-visible{outline:4px solid var(--gold);outline-offset:2px;border-radius:6px}
.skip{position:absolute;right:-999px;top:0;background:#000;color:#fff;padding:.6rem 1rem;z-index:99}.skip:focus{right:0}
header.top{position:sticky;top:0;z-index:50;background:rgba(29,27,58,.96);color:#fff;box-shadow:0 6px 18px rgba(0,0,0,.18)}
.topin{max-width:1200px;margin:auto;display:flex;align-items:center;gap:.6rem;padding:.45rem .8rem;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:.5rem;color:#fff;text-decoration:none;font-weight:800;font-size:1.05rem}
.brand img{width:34px;height:34px;border-radius:50%;background:#fff}
nav.main{display:flex;gap:.25rem;flex-wrap:wrap;flex:1}
nav.main a{color:#f1edff;text-decoration:none;padding:.35rem .6rem;border-radius:999px;font-size:.92rem}
nav.main a:hover,nav.main a[aria-current=page]{background:#fff;color:#1d1b3a}
.tools{display:flex;gap:.3rem}
.tools button{background:#fff2;color:#fff;border:1px solid #fff5;border-radius:999px;padding:.3rem .6rem;font:inherit;font-size:.85rem;cursor:pointer}
.menu-btn{display:none}
@media(max-width:820px){nav.main{display:none;width:100%;flex-direction:column}nav.main.open{display:flex}.menu-btn{display:inline-block}}
.crumbs{max-width:1200px;margin:.6rem auto 0;padding:0 1rem;font-size:.9rem;color:var(--muted)}
.crumbs a{color:var(--muted)}
main{max-width:1200px;margin:auto;padding:1rem}
h1{font-size:clamp(1.6rem,4vw,2.5rem);line-height:1.2;margin:.4rem 0 .6rem}
h2{font-size:1.45rem;margin:1.6rem 0 .6rem}
.lead{font-size:1.12rem;color:var(--muted);max-width:780px}
.hero{position:relative;background:linear-gradient(135deg,#2b1b6e,#6A3FD4 55%,#d9480f);color:#fff;border-radius:28px;padding:2rem 1.5rem 2.2rem;overflow:hidden;box-shadow:0 18px 40px rgba(60,30,140,.35)}
.hero .lead{color:#efe9ff}
.hero .binder{position:absolute;left:1.4rem;top:1.2rem;width:180px;height:220px;transform:perspective(700px) rotateY(18deg) rotateX(6deg);border-radius:10px 18px 18px 10px;background:linear-gradient(90deg,#f2b705,#ffd43b);box-shadow:-14px 16px 0 #c78f00,-18px 22px 30px rgba(0,0,0,.35)}
.hero .binder:before{content:"🗂️";position:absolute;inset:0;display:grid;place-items:center;font-size:4.5rem}
.hero .binder i{position:absolute;right:-12px;width:30px;height:26px;border-radius:0 8px 8px 0}
@media(max-width:700px){.hero .binder{display:none}}
.btn{display:inline-flex;align-items:center;gap:.4rem;background:var(--gold);color:#1d1b3a;font-weight:800;text-decoration:none;border:0;border-radius:999px;padding:.65rem 1.2rem;font:inherit;font-weight:800;cursor:pointer;box-shadow:0 5px 0 #b38600;transition:transform .1s}
.btn:active{transform:translateY(3px);box-shadow:0 2px 0 #b38600}
.btn.ghost{background:#fff;color:#4b2bb0;box-shadow:0 5px 0 #c9c0ef}
.btn.sm{padding:.35rem .8rem;font-size:.9rem;box-shadow:0 3px 0 #b38600}
.grid{display:grid;gap:1rem;grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
.tile{position:relative;display:block;text-decoration:none;color:var(--ink);background:var(--paper);border-radius:var(--r);padding:1.1rem 1.1rem 1rem;border-top:10px solid var(--c,#6A3FD4);box-shadow:0 10px 0 rgba(0,0,0,.06),0 14px 26px rgba(40,20,90,.12);transition:transform .15s,box-shadow .15s}
.tile:hover{transform:translateY(-4px) rotate(-.4deg);box-shadow:0 14px 0 rgba(0,0,0,.06),0 20px 30px rgba(40,20,90,.18)}
.tile .em{font-size:2.1rem}
.tile b{display:block;font-size:1.15rem;margin:.2rem 0}
.tile small{color:var(--muted)}
.tab-strip{display:flex;gap:.35rem;flex-wrap:wrap;margin:1rem 0}
.tabx{border:0;cursor:pointer;font:inherit;font-weight:700;color:#fff;background:var(--c);padding:.45rem .85rem;border-radius:12px 12px 4px 4px;box-shadow:inset 0 -4px 0 rgba(0,0,0,.18);opacity:.82}
.tabx[aria-pressed=true]{opacity:1;transform:translateY(-3px);box-shadow:inset 0 -4px 0 rgba(0,0,0,.25),0 6px 12px rgba(0,0,0,.18)}
.filters{background:var(--paper);border-radius:var(--r);padding:1rem;box-shadow:0 8px 20px rgba(40,20,90,.08);display:grid;gap:.7rem;grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}
.filters label{font-weight:700;font-size:.9rem;display:block;margin-bottom:.2rem}
.filters input,.filters select,textarea,.wz input,.wz select{width:100%;font:inherit;padding:.55rem .7rem;border:2px solid #d6cff2;border-radius:12px;background:#fff}
.count{margin:.8rem 0;color:var(--muted);font-weight:700}
.pcard{position:relative;background:var(--paper);border-radius:16px 16px 16px 16px;margin:0 0 1.1rem;box-shadow:0 8px 0 rgba(0,0,0,.05),0 12px 26px rgba(40,20,90,.12);border-right:12px solid var(--c);overflow:hidden}
.pcard:before{content:"";position:absolute;right:12px;top:0;bottom:0;width:22px;background:repeating-linear-gradient(180deg,transparent 0 30px,#cfc8e8 30px 42px,transparent 42px 70px);opacity:.0}
.phead{display:flex;gap:.6rem;align-items:flex-start;padding:.9rem 1rem .4rem}
.phead .em{font-size:1.8rem;line-height:1}
.phead h3{margin:0;font-size:1.15rem}
.chips{display:flex;flex-wrap:wrap;gap:.3rem;margin:.3rem 0 0}
.chip{font-size:.78rem;background:#f0ecff;color:#3d2a8a;border-radius:999px;padding:.1rem .55rem}
.chip.cat{background:var(--c);color:#fff}
.pbody{padding:0 1rem 1rem}
.goal{margin:.3rem 0 .6rem;color:#33325a}
pre.ptxt{white-space:pre-wrap;font-family:inherit;background:#fbf8ff;border:2px dashed #cfc3f5;border-radius:14px;padding:.8rem 1rem;margin:.3rem 0;font-size:.98rem;line-height:1.7}
.slot{background:#ffe066;border-radius:6px;padding:0 .25rem;font-weight:700}
.prow{display:flex;gap:.4rem;flex-wrap:wrap;margin:.5rem 0}
.prow button{font:inherit;font-size:.9rem;border:2px solid #d6cff2;background:#fff;border-radius:999px;padding:.3rem .8rem;cursor:pointer}
.prow button.fav[aria-pressed=true]{background:#ffe066;border-color:#f2b705}
details.more{margin-top:.4rem;background:#fff;border-radius:12px;padding:.4rem .8rem;border:1px solid #ece6ff}
details.more summary{cursor:pointer;font-weight:700;color:#4b2bb0}
.tips{display:grid;gap:.6rem;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));margin:.5rem 0}
.tip{border-radius:12px;padding:.6rem .8rem;font-size:.95rem}
.tip.ex{background:#eef7ff}.tip.c{background:#fff4e6}.tip.o{background:#e6fcf5}.tip.u{background:#f3f0ff}
.tip b{display:block}
.toast{position:fixed;bottom:1rem;left:50%;transform:translateX(-50%);background:#1d1b3a;color:#fff;padding:.6rem 1.2rem;border-radius:999px;opacity:0;transition:opacity .2s;z-index:99;pointer-events:none}
.toast.on{opacity:1}
footer.foot{margin-top:2rem;background:#1d1b3a;color:#e9e6ff;padding:1.4rem 1rem}
footer.foot .in{max-width:1200px;margin:auto;display:flex;gap:1rem;flex-wrap:wrap;align-items:center;justify-content:space-between}
footer.foot a{color:#ffd43b}
footer.foot img{width:40px;height:40px;border-radius:50%;background:#fff;vertical-align:middle}
.pager{display:flex;justify-content:space-between;gap:1rem;margin:2rem 0 0}
.pager a{background:var(--paper);padding:.7rem 1rem;border-radius:14px;text-decoration:none;font-weight:700;box-shadow:0 6px 14px rgba(40,20,90,.1)}
.box{background:var(--paper);border-radius:var(--r);padding:1rem 1.2rem;margin:1rem 0;box-shadow:0 8px 20px rgba(40,20,90,.08);border-right:8px solid var(--c,#6A3FD4)}
.block6{display:grid;gap:1rem;grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
.bb{background:var(--paper);border-radius:var(--r);padding:1rem;box-shadow:0 10px 0 var(--c),0 14px 24px rgba(40,20,90,.12);transform:perspective(800px) rotateX(2deg)}
.bb .n{display:inline-grid;place-items:center;width:2.2rem;height:2.2rem;border-radius:50%;background:var(--c);color:#fff;font-weight:800;margin-left:.4rem}
.weak{background:#fff0f0;border-radius:10px;padding:.4rem .7rem;margin:.4rem 0}.strong{background:#ebfbee;border-radius:10px;padding:.4rem .7rem;margin:.4rem 0}
table.tbl{width:100%;border-collapse:collapse;background:#fff;border-radius:12px;overflow:hidden}
table.tbl th,table.tbl td{border:1px solid #e3ddf7;padding:.5rem .6rem;text-align:right;vertical-align:top}
table.tbl th{background:#efe9ff}
.wz{background:var(--paper);border-radius:22px;padding:1rem 1.2rem;box-shadow:0 12px 30px rgba(40,20,90,.12)}
.steps{display:flex;gap:.3rem;flex-wrap:wrap;margin-bottom:1rem}
.steps button{font:inherit;border:0;border-radius:999px;padding:.3rem .8rem;background:#ece6ff;cursor:pointer}
.steps button[aria-current=step]{background:#6A3FD4;color:#fff}
.opts{display:grid;gap:.6rem;grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}
.opt{font:inherit;text-align:center;background:#fff;border:3px solid #e3ddf7;border-radius:16px;padding:.8rem .5rem;cursor:pointer;min-height:84px;box-shadow:0 5px 0 #e3ddf7}
.opt .em{display:block;font-size:1.7rem}
.opt[aria-pressed=true]{border-color:#6A3FD4;background:#f3efff;box-shadow:0 5px 0 #6A3FD4}
.out{display:grid;gap:1rem;grid-template-columns:1fr 1fr}
@media(max-width:860px){.out{grid-template-columns:1fr}}
.timeline{border-right:4px solid #d6cff2;padding-right:1rem}
.timeline .st{position:relative;background:var(--paper);border-radius:14px;padding:.7rem 1rem;margin:0 0 .9rem;box-shadow:0 6px 14px rgba(40,20,90,.08)}
.timeline .st:before{content:"";position:absolute;right:-1.55rem;top:1rem;width:1rem;height:1rem;border-radius:50%;background:var(--gold);border:3px solid #fff}
.say{background:#fff9db;border-radius:10px;padding:.4rem .7rem;margin:.3rem 0}
.sitemap ul{columns:2 260px}
.note{font-size:.9rem;color:var(--muted)}
.kbd{border:1px solid #bbb;border-bottom-width:3px;border-radius:6px;padding:0 .35rem;font-size:.85rem;background:#fff}
.print-only{display:none}
@media print{header.top,footer.foot,.crumbs,.pager,.prow,.filters,.tab-strip,.no-print,.toast,.skip{display:none!important}body{background:#fff}main{max-width:none;padding:0}.pcard{break-inside:avoid;box-shadow:none;border:1px solid #ccc;border-right:10px solid var(--c)}details.more{display:block}details.more>*{display:block}.print-only{display:block}}
.pc-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8mm}
@media print{.pc-grid{gap:5mm}.pc{break-inside:avoid}}
.pc{background:#fff;border:2px solid var(--c);border-radius:14px;padding:.7rem .9rem;border-top:12px solid var(--c);font-size:.88rem}
.pc h3{margin:0 0 .2rem;font-size:1rem}
.pc pre{white-space:pre-wrap;font-family:inherit;margin:.3rem 0;font-size:.85rem;background:#faf8ff;border-radius:8px;padding:.4rem .5rem}

@media(max-width:700px){table.tbl{display:block;overflow-x:auto;font-size:.9rem}}
table.tbl td,table.tbl th{overflow-wrap:anywhere}
