:root{--ink:#152b45;--muted:#53647a;--blue:#087b94;--line:#d9e4ee;--orange:#f9ba50}*{box-sizing:border-box}body{margin:0;background:#f3f7fb;color:var(--ink);font-family:system-ui,-apple-system,"Segoe UI",sans-serif;font-size:16px;line-height:1.5}button,input,select{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer}a{color:inherit}button,.secondary,.primary{min-height:44px;padding:10px 16px;border-radius:10px;border:1px solid var(--line);background:white;color:var(--ink);font-weight:650;text-decoration:none;display:inline-flex;align-items:center;justify-content:center}.primary{background:var(--blue);color:white;border-color:var(--blue)}button:hover,.secondary:hover{background:#e7f4fa}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #bd6a08;outline-offset:3px}.skip{position:absolute;top:-100px;background:white;padding:12px;z-index:9}.skip:focus{top:0}header{padding:18px max(24px,calc((100% - 1260px)/2));display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);background:white;gap:20px}.brand{display:flex;align-items:center;gap:22px;text-decoration:none;font-size:20px;font-weight:750}.brand img{width:172px;height:54px;object-fit:contain}.brand span{border-left:1px solid var(--line);padding-left:22px}.header-note{font-size:14px;color:var(--muted)}main{max-width:1260px;margin:auto;padding:0 24px 60px}.intro{display:flex;justify-content:space-between;gap:20px;align-items:center;padding:32px 0 24px}.eyebrow{font-size:14px;font-weight:750;letter-spacing:.12em;color:var(--blue);margin:0}h1{font-size:clamp(28px,4vw,43px);line-height:1.15;margin:8px 0 10px;letter-spacing:-.025em}.intro p:last-child{margin:0;color:var(--muted)}.number{min-width:150px;border-left:4px solid var(--orange);padding-left:20px}.number strong{display:block;font-size:46px;line-height:1.1}.number span{color:var(--muted);font-size:14px}.toolbar{display:flex;align-items:end;gap:14px;padding:18px;background:white;border:1px solid var(--line);border-radius:14px}label{display:grid;gap:6px;font-size:14px;font-weight:700}.search-label{flex:1}input,select{width:100%;border:1px solid #a5b6c9;border-radius:8px;background:white;padding:11px 12px;min-height:46px;color:var(--ink);font-size:16px}.filter-row{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:18px 0}.filter{border-radius:24px;background:transparent}.filter.active{background:var(--ink);color:white;border-color:var(--ink)}#count{margin-left:auto;color:var(--muted);font-size:14px}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.card{background:white;overflow:hidden;border:1px solid var(--line);border-radius:14px;transition:box-shadow .2s,transform .2s}.card:hover{box-shadow:0 10px 24px #152b4514;transform:translateY(-2px)}.card-open{display:block;width:100%;border:0;background:none;padding:0;text-align:left;border-radius:0;color:var(--ink);font-weight:400}.card-open:hover{background:white}.thumb{display:block;width:100%;aspect-ratio:1.45;object-fit:contain;background:#fbf1da;padding:9px}.card-text{display:block;padding:16px}.category{font-size:12px;font-weight:750;text-transform:uppercase;letter-spacing:.055em;color:var(--blue)}.card h2{font-size:22px;line-height:1.25;margin:5px 0}.author{display:block;color:var(--muted)}.meta{display:block;font-size:14px;margin-top:10px;color:var(--muted)}.card-action{display:block;font-size:14px;color:var(--blue);font-weight:750;margin-top:14px}.empty{padding:50px;text-align:center}footer{padding:22px;text-align:center;color:var(--muted);font-size:14px;border-top:1px solid var(--line)}dialog{width:min(1280px,calc(100% - 32px));max-height:calc(100dvh - 32px);border:0;border-radius:16px;padding:0;background:#f3f7fb;color:var(--ink)}dialog::backdrop{background:#102339b8}.dialog-head{position:sticky;top:0;z-index:1;background:white;padding:16px 24px;border-bottom:1px solid var(--line);display:flex;gap:20px;justify-content:space-between;align-items:center}.dialog-head p{margin:0;color:var(--muted);font-size:14px}.dialog-head h2{margin:2px 0;font-size:28px;line-height:1.25}.study-layout{display:grid;grid-template-columns:minmax(0,1fr) 310px;padding:24px;gap:24px}.image-tools{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}#diagram{width:100%;display:block;border-radius:10px}.hint{color:var(--muted);font-size:14px}aside{background:white;border:1px solid var(--line);border-radius:12px;padding:20px}h3{margin:0 0 12px;font-size:20px}#anchors{padding-left:22px}#anchors li{margin:12px 0}.quiz{margin-top:28px;border-top:2px solid var(--orange);padding-top:20px}.quiz p{color:var(--muted);font-size:14px}.question{margin:20px 0}.question>p{font-size:16px;color:var(--ink);font-weight:650}summary{cursor:pointer;color:var(--blue);padding:8px 0;font-size:14px;font-weight:700}.answer{background:#edf7fb;border-radius:8px;padding:12px;font-size:16px}#viewer{background:#17293d;max-width:none;width:calc(100% - 20px);height:calc(100dvh - 20px);max-height:none} .viewer-tools{display:flex;justify-content:center;gap:8px;align-items:center;padding:10px;flex-wrap:wrap;color:white}.viewer-tools button{min-width:44px}.zoom-scroll{overflow:auto;height:calc(100% - 76px);padding:10px}.zoom-scroll img{display:block;max-width:none;margin:auto;transform-origin:top left}body.modal-open{overflow:hidden}@media(max-width:950px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.study-layout{grid-template-columns:1fr}.toolbar{flex-wrap:wrap}.search-label{min-width:100%}}@media(max-width:600px){main{padding:0 16px 40px}header{padding:12px 16px}.brand{gap:10px;font-size:16px}.brand img{width:125px;height:40px}.brand span{padding-left:10px}.header-note,.number{display:none}.intro{padding:24px 0}.grid{grid-template-columns:1fr}.toolbar>label:not(.search-label){flex:1;min-width:0}#reset{padding:10px;font-size:14px}.filter{padding:8px 12px;font-size:14px}#count{width:100%;margin-top:4px}.dialog-head{padding:14px}.dialog-head h2{font-size:22px}.study-layout{padding:14px;gap:14px}.image-tools>*{flex:1;font-size:14px;padding:9px}dialog{width:calc(100% - 16px);max-height:calc(100dvh - 16px)}.card-text{padding:16px}.viewer-tools{gap:5px}.viewer-tools button{padding:8px;font-size:14px}.zoom-scroll{height:calc(100% - 100px)}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}
