.crystal-quest-shell{--cq-ink:#184d45;--cq-green:#217d62;--cq-paper:#fffdf4;max-width:1120px;margin:auto;padding:clamp(12px,3vw,32px);color:var(--cq-ink);background:linear-gradient(180deg,#f3fbf5,#fdfaf0);border-radius:28px;font-family:inherit;overflow-wrap:anywhere}
.crystal-quest-shell *{box-sizing:border-box;min-width:0}
.cq-top{display:flex;justify-content:space-between;gap:20px;align-items:flex-start}
.cq-eyebrow{display:block;font-size:calc(.75rem * var(--mw-font-scale,1));font-weight:800;letter-spacing:.12em;color:#447d69}
.cq-top h1{font-size:clamp(calc(1.65rem * var(--mw-font-scale,1)),4vw,calc(2.75rem * var(--mw-font-scale,1)));line-height:1.25;margin:.4em 0 .25em;font-weight:900;letter-spacing:-.035em}
.cq-subtitle{margin:0;color:#527269;font-size:calc(1rem * var(--mw-font-scale,1))}
.cq-button{appearance:none;border:2px solid #bfd3bd;border-radius:14px;background:#f4f8ed;color:#184d45;min-height:46px;padding:10px 17px;font-family:inherit;font-size:calc(.95rem * var(--mw-font-scale,1));font-weight:750;line-height:1.4;cursor:pointer;transition:background .15s,transform .15s;white-space:normal;text-align:center}
.cq-button:hover:enabled{background:#e8f2db;transform:translateY(-1px)}
.cq-button:active:enabled{transform:translateY(1px)}
.cq-button:disabled{cursor:default;color:#6d7e70;background:#edf0e8;border-color:#dbe2d5;opacity:.7}
.crystal-quest-shell button:focus-visible{outline:3px solid #b36b21;outline-offset:4px}
.crystal-quest-shell h1:focus,.crystal-quest-shell h2:focus{outline:none}
.cq-primary{background:#217c60;border-color:#217c60;color:white;box-shadow:0 4px 0 #15553f}
.cq-primary:hover:enabled{background:#17644e}
.cq-quiet{background:#fffdf4;border-color:#d8e2cc}
.cq-link{border-color:transparent;background:transparent;text-decoration:underline;font-weight:600}
.cq-world-wrap{position:relative;isolation:isolate;margin:20px 0 12px;border-radius:24px;background:linear-gradient(#e1f4f2,#edf7e7);overflow:hidden}
.cq-world-host{height:0;position:relative;transition:height .2s}
.cq-world-host[data-world3d=ready]{height:350px}
.cq-world-host[data-world3d=ready]~.cq-island{display:none}
.cq-world-host canvas{display:block;width:100%;height:100%;max-width:100%;touch-action:pan-y}
.cq-island{display:block;line-height:0;max-height:320px}
.cq-island svg{width:100%;height:auto;max-height:320px;display:block}
.cq-restored{animation:cq-grow .45s ease-out both;transform-origin:center}
.cq-npc{display:flex;align-items:center;gap:15px;background:#fffdf2;border:1px solid #e4dfc1;border-radius:20px;padding:17px 20px;box-shadow:0 4px 0 #e8ead8;margin:10px 0 20px}
.cq-npc strong{font-size:calc(.8rem * var(--mw-font-scale,1));color:#866333}
.cq-npc p{margin:4px 0 0;line-height:1.65;font-size:calc(1rem * var(--mw-font-scale,1))}
.cq-owl{position:relative;display:grid;place-items:center;flex:0 0 54px;width:54px;height:60px;background:#87ad81;border-radius:48% 48% 40% 40%;color:#ffef99;font-size:calc(1.6rem * var(--mw-font-scale,1));box-shadow:inset 0 -9px 0 #6d956b;border:3px solid #ebefce}
.cq-owl:before,.cq-owl:after{content:'';position:absolute;top:11px;width:10px;height:12px;border-radius:50%;background:#fff9d4;border:3px solid #3c5f44}
.cq-owl:before{left:8px}.cq-owl:after{right:8px}
.cq-map-intro{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:25px 0 16px}
.cq-map-intro h2{margin:0;font-size:calc(1.4rem * var(--mw-font-scale,1))}.cq-map-intro p{margin:0;color:#5a7165;font-size:calc(.9rem * var(--mw-font-scale,1))}
.cq-chapters{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.cq-chapter{padding:22px 18px 16px;border-radius:22px;background:#fffdf4;border:1px solid #dce6cd;box-shadow:0 6px 0 #e5ebdb;display:flex;flex-direction:column;align-items:flex-start}
.cq-chapter-bridges{background:#f0f8f7;border-color:#cce1de}.cq-chapter-lighthouse{background:#f9f2e3;border-color:#e8d9b7}
.cq-chapter-icon{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:#e5efcd;font-size:calc(2rem * var(--mw-font-scale,1));color:#658c43}
.cq-chapter-bridges .cq-chapter-icon{background:#d5ece7;color:#39837b}.cq-chapter-lighthouse .cq-chapter-icon{background:#f9e3b0;color:#996b28}
.cq-chapter h3{font-size:calc(1.12rem * var(--mw-font-scale,1));line-height:1.4;margin:15px 0 8px}.cq-chapter>p{font-size:calc(.9rem * var(--mw-font-scale,1));line-height:1.7;margin:0 0 18px;color:#567064;flex:1}
.cq-stops{display:grid;gap:9px;width:100%}
.cq-stop{display:grid;grid-template-columns:36px minmax(0,1fr);gap:1px 10px;align-items:center;text-align:left;border:1px solid #dce4d4;border-radius:13px;min-height:65px;padding:10px;background:#fffdf7;color:#285144;font-family:inherit;cursor:pointer}
.cq-stop-number{grid-row:span 2;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#eaf0dd;font-weight:850}
.cq-stop-title{font-weight:750;font-size:calc(.88rem * var(--mw-font-scale,1));line-height:1.4}.cq-stop-label{font-size:calc(.74rem * var(--mw-font-scale,1));color:#647a66}
.cq-stop.ready{border:2px solid #4d8c67;background:#f5fbe9}.cq-stop.ready .cq-stop-number{background:#2e7b59;color:#fff}
.cq-stop.done .cq-stop-number{background:#b7d9a5;color:#285e39}.cq-stop.locked{opacity:.6;cursor:default}
.cq-stop:enabled:hover{box-shadow:0 3px 0 #c9d9bb;background:#f5fae8}
.cq-chapter-count{font-size:calc(.74rem * var(--mw-font-scale,1));font-weight:700;align-self:center;color:#5c7861;margin-top:14px}
.cq-storage{color:#617364;font-size:calc(.78rem * var(--mw-font-scale,1));text-align:center;line-height:1.6;margin:20px 0 10px}
.cq-confirm{display:flex;gap:10px;flex-wrap:wrap;padding:18px;border:1px solid #dacb9d;border-radius:16px;background:#fff7e1}.cq-confirm p{flex-basis:100%;margin:0 0 5px;line-height:1.6}
.cq-play-nav{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin:18px 0}.cq-progress-label{font-size:calc(.85rem * var(--mw-font-scale,1));font-weight:700;color:#507760}
.cq-play-card{padding:clamp(14px,3vw,30px);border:1px solid #dce4cc;border-radius:24px;background:var(--cq-paper);box-shadow:0 8px 0 #e5ead9}
.cq-play-card>h2{font-size:clamp(calc(1.3rem * var(--mw-font-scale,1)),3vw,calc(1.8rem * var(--mw-font-scale,1)));margin:0 0 16px;line-height:1.4}
.cq-equation{display:flex;justify-content:center;font-size:clamp(calc(1.2rem * var(--mw-font-scale,1)),4vw,calc(2rem * var(--mw-font-scale,1)));font-weight:850;color:#28684c;padding:16px 12px;margin:10px 0 20px;background:#eaf4dd;border-radius:16px;text-align:center;line-height:1.5}
.cq-frame-board{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;padding:5px 0 15px}.cq-plot{text-align:center}.cq-plot h3,.cq-place-group h3{font-size:calc(1rem * var(--mw-font-scale,1));margin:0 0 12px}
.cq-ten-frame{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px;background:#e4ead7;padding:8px;border-radius:14px;border:2px solid #b4c9a5;max-width:340px;margin:0 auto 14px}
.cq-frame-cell{display:grid;place-items:center;aspect-ratio:1;border:1px dashed #b7c9a5;border-radius:8px;background:#f7faed;color:#628943;font-size:clamp(calc(.9rem * var(--mw-font-scale,1)),3vw,calc(1.8rem * var(--mw-font-scale,1)))}
.cq-frame-cell.filled{border:1px solid #abc68c;background:#d1e9b8;box-shadow:inset 0 -3px 0 #bad499;color:#437949;animation:cq-grow .16s ease-out}
.cq-plot:nth-child(2) .cq-frame-cell.filled{background:#e7dff7;border-color:#baa8d6;box-shadow:inset 0 -3px 0 #cdbde3;color:#8063a8}
.cq-board-caption{grid-column:1/-1;text-align:center;font-size:calc(.86rem * var(--mw-font-scale,1));color:#63715b;line-height:1.6;margin:8px 0}
.cq-number-line{--cq-stops:11;display:grid;grid-template-columns:repeat(var(--cq-stops),minmax(0,1fr));padding:15px 0 12px;background:linear-gradient(transparent 44px,#d3e5d8 44px,#d3e5d8 49px,transparent 49px);border-radius:14px}
.cq-number-stop{display:grid;place-items:center;gap:6px;font-size:clamp(calc(.65rem * var(--mw-font-scale,1)),2vw,calc(1rem * var(--mw-font-scale,1)));font-weight:750;color:#68806a}
.cq-route-marker{display:grid;place-items:center;width:clamp(16px,3.2vw,38px);height:38px;font-size:calc(1.6rem * var(--mw-font-scale,1));color:#83a79a}
.cq-number-stop.current .cq-route-marker{background:#478a6c;color:#fff4b6;border-radius:12px;box-shadow:0 3px 0 #2f6650}.cq-number-stop.target{color:#926a29}.cq-number-stop.target .cq-route-marker{color:#a47825}
.cq-bridge-tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;max-width:580px;margin:20px auto}
.cq-bridge-tile{display:grid;gap:2px;border:2px solid #bda778;background:#fff0cd;border-radius:16px;padding:14px 4px;min-height:80px;color:#735b2f;font-family:inherit;cursor:pointer;box-shadow:0 4px 0 #d6c393}
.cq-bridge-tile strong{font-size:calc(1.7rem * var(--mw-font-scale,1))}.cq-bridge-tile span{font-size:calc(.78rem * var(--mw-font-scale,1))}.cq-bridge-tile:disabled{opacity:.42;cursor:default;box-shadow:none}.cq-bridge-tile.used{background:#e5efdf;color:#497353}
.cq-bundle-board{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.cq-place-group{text-align:center;background:#f6f8ed;padding:16px 12px;border-radius:16px;border:1px solid #dce5cc}
.cq-place-collection{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;align-content:center;min-height:110px}.cq-place-collection.ones{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));align-content:center;gap:5px}
.cq-one-crystal{display:block;aspect-ratio:1;min-height:8px;max-width:25px;background:#82b9b2;border:1px solid #548d87;border-radius:3px;box-shadow:inset 2px 2px #c2ded6}
.cq-ten-rod{display:grid;grid-template-rows:repeat(10,8px);width:17px;gap:1px;padding:3px;background:#bd99c5;border:1px solid #93669c;border-radius:4px}
.cq-ten-rod>span{display:block;background:#e3c3e7;border-radius:1px}.cq-zero{font-size:calc(2rem * var(--mw-font-scale,1));color:#a1b09b;grid-column:1/-1}
.cq-bundle-actions{grid-column:1/-1;display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin:8px 0}
.cq-tools{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;border-top:1px solid #e3e8d7;padding-top:20px;margin-top:15px}
.cq-hints{padding:16px 20px;background:#fff4d6;border:1px solid #e9d7a6;border-radius:16px;margin-top:18px;color:#735827;font-size:calc(.92rem * var(--mw-font-scale,1));line-height:1.7}.cq-hints p{margin:6px 0}
.cq-feedback:empty{display:none}.cq-feedback{padding:16px 18px;margin-top:16px;border-radius:14px;background:#edf2e5;color:#476342;font-weight:650;line-height:1.65}.cq-feedback.retry{background:#fff0d9;color:#785224}.cq-feedback.success{background:#e1f0d6;color:#2f683c}.cq-feedback.hint{background:#fff6de;color:#785d28}
.cq-success{text-align:center;margin:24px 0 0;padding:22px 14px 10px;border-top:1px solid #dce6cf}.cq-success-star{display:inline-grid;place-items:center;width:55px;height:55px;border-radius:18px;background:#fff1b7;color:#a87c24;font-size:calc(2.1rem * var(--mw-font-scale,1));animation:cq-grow .4s ease-out}.cq-success>h3{font-size:calc(1.5rem * var(--mw-font-scale,1));margin:10px 0}.cq-success>p{font-size:calc(.9rem * var(--mw-font-scale,1));color:#526e54;line-height:1.6}
.cq-reasoning{max-width:650px;margin:24px auto;text-align:left;padding:20px;background:#f5f6ec;border:1px solid #e3e5d0;border-radius:18px}.cq-optional{font-size:calc(.75rem * var(--mw-font-scale,1));color:#7a7a57;margin:0 0 6px;font-weight:650}.cq-reasoning h3{font-size:calc(1rem * var(--mw-font-scale,1));margin:0 0 14px;line-height:1.6}.cq-reason-options{display:grid;gap:8px}.cq-reason{text-align:left;font-weight:600;background:#fffef8}.cq-reason.selected{border-color:#5e8e69;background:#e7f0db}.cq-reason-feedback{font-size:calc(.9rem * var(--mw-font-scale,1));line-height:1.7;color:#527348;margin:14px 0 0}
.cq-summary{text-align:center;padding:30px 20px;background:#fffdf1;border:1px solid #dfe5cc;border-radius:24px}.cq-summary-medal{display:block;font-size:calc(4rem * var(--mw-font-scale,1));color:#b98b2e}.cq-summary h2{font-size:clamp(calc(1.4rem * var(--mw-font-scale,1)),4vw,calc(2rem * var(--mw-font-scale,1)));margin:10px 0}.cq-summary p{line-height:1.75}.cq-summary .cq-button{margin-top:16px}.cq-fine{font-size:calc(.86rem * var(--mw-font-scale,1));color:#63735a}
@keyframes cq-grow{from{opacity:.5;transform:scale(.9)}to{opacity:1;transform:scale(1)}}
@media(max-width:800px){.cq-chapters{grid-template-columns:1fr}.cq-chapter{display:grid;grid-template-columns:44px minmax(0,1fr);gap:0 14px}.cq-chapter-icon{grid-row:span 2}.cq-chapter h3{margin:0 0 5px}.cq-chapter>p{margin-bottom:15px}.cq-stops{grid-column:1/-1;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.cq-stop{display:flex;flex-direction:column;text-align:center;gap:6px;padding:10px 6px}.cq-stop-title{font-size:calc(.8rem * var(--mw-font-scale,1))}.cq-chapter-count{grid-column:1/-1;justify-self:center}.cq-world-host[data-world3d=ready]{height:300px}}
@media(max-width:480px){.crystal-quest-shell{padding:12px;border-radius:18px}.cq-top{flex-direction:column;gap:12px}.cq-top>.cq-button{font-size:calc(.82rem * var(--mw-font-scale,1));min-height:44px;padding:8px 12px}.cq-world-wrap{margin-top:15px}.cq-world-host[data-world3d=ready]{height:260px}.cq-npc{gap:10px;padding:14px 12px;border-radius:16px}.cq-npc p{font-size:calc(.9rem * var(--mw-font-scale,1))}.cq-owl{flex-basis:42px;width:42px;height:50px;border-width:2px}.cq-owl:before{left:5px}.cq-owl:after{right:5px}.cq-owl:before,.cq-owl:after{width:9px;height:10px;border-width:2px}.cq-frame-board{grid-template-columns:1fr;gap:20px}.cq-ten-frame{max-width:270px;gap:5px}.cq-frame-cell{font-size:calc(1.5rem * var(--mw-font-scale,1))}.cq-play-card{padding:14px 10px}.cq-number-line{padding-top:8px;background:linear-gradient(transparent 36px,#d3e5d8 36px,#d3e5d8 41px,transparent 41px)}.cq-route-marker{height:34px;font-size:calc(1.1rem * var(--mw-font-scale,1));min-width:15px}.cq-number-stop{font-size:calc(.7rem * var(--mw-font-scale,1))}.cq-bridge-tiles{gap:8px}.cq-bridge-tile strong{font-size:calc(1.4rem * var(--mw-font-scale,1))}.cq-bridge-tile span{font-size:calc(.68rem * var(--mw-font-scale,1))}.cq-bundle-board{grid-template-columns:1fr;gap:12px}.cq-place-collection.ones{max-width:270px;margin:auto}.cq-tools{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.cq-tools .cq-button{font-size:calc(.8rem * var(--mw-font-scale,1));padding:9px 6px}.cq-bundle-actions{display:grid;grid-template-columns:1fr}.cq-progress-label{font-size:calc(.8rem * var(--mw-font-scale,1))}.cq-reasoning{padding:14px 10px}.cq-summary{padding:24px 12px}}
@media(prefers-reduced-motion:reduce){.crystal-quest-shell *{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
.cq-world-caption{display:none;text-align:center;font-size:calc(.75rem * var(--mw-font-scale,1));line-height:1.5;color:#52786c;padding:0 14px 14px;margin:0}.cq-world-host[data-world3d=ready]~.cq-world-caption{display:block}
/* Keep complete two-digit labels at large text sizes; the line, not the page, scrolls. */
.cq-number-line-scroll{max-width:100%;overflow-x:auto;overscroll-behavior-x:contain;border-radius:14px;scrollbar-width:thin;scrollbar-color:#88ad94 #e6efdf;padding-bottom:6px}
.cq-number-line-scroll:focus-visible{outline:3px solid #b36b21;outline-offset:3px}
.cq-number-line{min-width:calc(var(--cq-stops) * 1.8rem * var(--mw-font-scale,1))}
.cq-number-stop>span:last-child{white-space:nowrap;overflow-wrap:normal;word-break:normal}
.cq-line-scroll-hint{margin:6px 0 10px;text-align:center;color:#49765a;font-size:calc(.78rem * var(--mw-font-scale,1));line-height:1.6}
.cq-line-scroll-hint[hidden]{display:none}
