.archive-page{padding:12px;border-radius:14px}.archive-filters{display:grid;grid-template-columns:2fr 1.4fr 1fr 1fr;gap:10px;margin:20px 0 12px}.archive-filters label{display:flex;flex-direction:column;gap:7px;font-size:12px;color:#b9c9d6}.archive-filters input,.archive-filters select{width:100%;min-width:0;padding:12px;background:#142433;color:#edf5fa;border:1px solid #40576b;border-radius:6px}.archive-actions,.series-index{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:14px 0}.archive-actions [aria-pressed=true]{border-color:#93e1ff;background:#244154}.archive-actions span{font-size:12px;color:#b8cfdd}.series-index button{font-size:12px;border-radius:6px;padding:8px 12px}.series-complete{border:2px solid transparent!important;background-image:linear-gradient(#101e2d,#101e2d),linear-gradient(110deg,#88e9ff,#ad9eff,#ffb6de,#ffe8a1,#88e9ff)!important;background-origin:border-box!important;background-clip:padding-box,border-box!important;background-size:100% 100%,300% 300%!important;animation:archive-prism 7s linear infinite;box-shadow:0 0 16px #a98bff29}.world-banner.series-complete{border-radius:14px}@keyframes archive-prism{0%{background-position:0 0,0% 50%}100%{background-position:0 0,300% 50%}}
.moogle-menu{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;margin:0 0 18px;min-height:68px;padding:5px 10px;border-bottom:1px solid #304657}.moogle-button{display:flex;align-items:center;gap:8px;border:0;padding:2px 8px;background:transparent;text-align:left;font-size:12px}.moogle-button small{display:block;color:#9db3c6;font-size:10px;margin-top:4px}.moogle-button img{width:56px;height:56px;object-fit:contain;image-rendering:pixelated;animation:moogle-hover 2.4s ease-in-out infinite}.simulator-shortcut{font-size:12px}.moogle-speech{flex:1 0 100%;background:#1a3042;border:1px solid #537c95;border-radius:10px;padding:12px;animation:moogle-hello .2s ease-out}.moogle-speech[hidden]{display:none}.moogle-speech p{margin:0 0 8px;font-size:14px;line-height:1.6}.moogle-speech button{font-size:11px;padding:5px 10px;margin-right:6px}@keyframes moogle-hover{50%{transform:translateY(-6px) rotate(3deg)}}@keyframes moogle-hello{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
#modal:has(.rule-simulator){width:min(850px,94vw);max-width:94vw}.rule-simulator>p{font-size:13px;color:#c0d2df}.lesson-tabs{display:flex;gap:6px;flex-wrap:wrap;margin:18px 0}.lesson-tabs button{padding:8px 12px}.lesson-tabs [aria-selected=true]{border-color:#90d7ff;background:#244b63}.practice-layout{display:grid;grid-template-columns:minmax(240px,1fr) minmax(220px,1fr);gap:22px;align-items:start}.practice-board{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:8px;background:#09131f;border:1px solid #536c83;border-radius:12px}.practice-cell{aspect-ratio:4/5;min-width:0;padding:0;border-radius:7px;overflow:hidden}.practice-empty{border:1px dashed #445c73;font-size:10px;background:#142334}.practice-drop{color:#c4efff;border:2px dashed #74d6ff;background:#1f3d55}.practice-card{position:relative;width:100%;height:100%;min-height:88px;border:2px solid;border-radius:7px;color:#fff;font-family:Georgia,serif}.practice-blue{background:linear-gradient(135deg,#225b95,#0c2947);border-color:#88d9ff}.practice-red{background:linear-gradient(135deg,#893343,#401320);border-color:#ff9caa}.practice-card b{position:absolute;font-size:21px;line-height:1}.pv-top{top:7px;left:50%;transform:translateX(-50%)}.pv-right{right:8px;top:50%;transform:translateY(-50%)}.pv-bottom{bottom:7px;left:50%;transform:translateX(-50%)}.pv-left{left:8px;top:50%;transform:translateY(-50%)}.practice-card span{position:absolute;top:45%;left:38%;font:10px system-ui;color:#d3e5f6}.practice-target{box-shadow:0 0 12px #a8ebff}.practice-flip{animation:practice-flip .5s ease-out}@keyframes practice-flip{from{transform:rotateY(90deg);filter:brightness(2)}to{transform:none;filter:brightness(1)}}.practice-hand{display:flex;justify-content:center;margin-top:12px;min-height:24px}.practice-hand .practice-card{width:75px;height:94px}.practice-hand>span{font-size:12px;color:#a4c7df}.practice-explanation small{font-size:10px;color:#91bdd8;letter-spacing:1px}.practice-message{line-height:1.65;min-height:70px}.practice-equation{background:#0d2336;border-left:3px solid #8edeff;padding:12px;margin:12px 0;line-height:1.6;font-size:14px}.practice-controls{display:flex;gap:8px;flex-wrap:wrap}.practice-explanation .subtle{font-size:12px;line-height:1.6}
@media(max-width:760px){.archive-filters{grid-template-columns:1fr 1fr}.archive-page{padding:8px}.moogle-menu{padding:3px 0}.moogle-button{padding:0}.moogle-button img{width:46px;height:46px}.simulator-shortcut{font-size:11px;padding:8px}.practice-layout{grid-template-columns:1fr}.practice-board{max-width:310px;margin:auto}.practice-cell{aspect-ratio:1}.practice-card{min-height:70px}.practice-explanation h3{margin:7px 0}.practice-message{min-height:0}.practice-explanation .subtle{margin-bottom:0}.practice-layout{gap:12px}.rule-simulator>p{font-size:12px}.lesson-tabs button{font-size:12px;padding:8px}.lesson-tabs{gap:4px}.practice-card b{font-size:19px}.archive-actions span{width:100%}}
@media(prefers-reduced-motion:reduce){.series-complete,.moogle-button img,.moogle-speech,.practice-flip{animation:none!important}}

@media(max-width:760px){#modal:has(.rule-simulator){padding:16px}#modal:has(.rule-simulator)>h2{font-size:23px;margin:4px 26px 12px 0}.rule-simulator .practice-basics{font-size:11px;line-height:1.4}.practice-board{max-width:250px}.practice-hand .practice-card{width:58px;height:70px;min-height:70px}.practice-hand .practice-card b{font-size:16px}.lesson-tabs{margin:10px 0}.lesson-tabs button{padding:7px;font-size:11px}}
