:root{--bg:#eef3ee;--paper:#fdfdfa;--rule:#6aa893;--rule-soft:#c5ddd3;--ink:#1c2a4a;--muted:#566475;--mark:#ffe36e;--mark-soft:#fff5c2;--red:#d63c2c;--red-soft:#fde3df;--on-ink:#fdfdfa;--ui:"Zen Maru Gothic", "Hiragino Maru Gothic ProN", "Yu Gothic", "Meiryo", sans-serif;--hand:"Klee One", "UD Digi Kyokasho N-R", "Hiragino Maru Gothic ProN", "Yu Gothic", sans-serif;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial;--bg:#14211c;--paper:#1d2f28;--rule:#4f8a76;--rule-soft:#2f4a40;--ink:#eef1e4;--muted:#a3b3a8;--mark:#8a7417;--mark-soft:#48431f;--red:#ff8d7d;--red-soft:#4d2721;--on-ink:#14211c}}*,:before,:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%;overflow-x:hidden}body{background:var(--bg);color:var(--ink);font-family:var(--ui);margin:0;font-size:1rem;font-weight:500;line-height:1.7;overflow-x:hidden}h1,h2,h3,p{margin:0}button,input,select{font:inherit;color:inherit;touch-action:manipulation;-webkit-tap-highlight-color:transparent}:focus-visible{outline:3px solid var(--ink);outline-offset:2px}.btn{border:1px solid var(--rule);background:var(--paper);cursor:pointer;white-space:nowrap;border-radius:999px;justify-content:center;align-items:center;gap:.35rem;min-height:2.5rem;padding:0 1.05rem;font-size:.9375rem;font-weight:700;transition:background-color .15s,transform .1s;display:inline-flex}.btn:hover:not(:disabled){background:var(--mark-soft)}.btn:active:not(:disabled){transform:translateY(1px)}.btn-primary{border-color:var(--ink);background:var(--ink);color:var(--on-ink)}.btn-primary:hover:not(:disabled){background:var(--ink);opacity:.9}.btn-accent{border-color:var(--red);background:var(--red);color:#fff}.btn-accent:hover:not(:disabled){background:var(--red);opacity:.9}.btn-active{border-color:var(--ink);background:var(--mark);color:var(--ink);box-shadow:0 0 0 1px var(--ink)}.btn-quiet{color:var(--muted);background:0 0;border-color:#0000;font-weight:500}.btn-sm{min-height:2.1rem;padding:0 .75rem;font-size:.8125rem}.btn:disabled{opacity:.55;cursor:default}.hanamaru{fill:none;width:4.5rem;height:4.5rem;stroke:var(--red);stroke-width:3px;stroke-linecap:round;stroke-linejoin:round;flex:none}.hanamaru.is-drawn polyline{stroke-dasharray:1;animation:1.4s ease-out .1s both draw}@keyframes draw{0%{stroke-dashoffset:1px}to{stroke-dashoffset:0}}.hanamaru-small{stroke-width:2.5px;opacity:.6;pointer-events:none;width:2.85rem;height:2.85rem;position:absolute;bottom:.15rem;right:.4rem}.home{grid-template-columns:minmax(0,1fr);gap:2.25rem;max-width:44rem;margin:0 auto;padding:1.75rem 1rem 4rem;display:grid}.home-side{grid-template-columns:minmax(0,1fr);gap:1.35rem;display:grid}.home-main{grid-template-columns:minmax(0,1fr);gap:2.25rem;display:grid}.home h2{font-size:1.125rem;font-weight:700}.hero{align-items:center;gap:clamp(.6rem,3vw,1.25rem);display:flex}.hero-text{flex:1;min-width:0}.crest{--crest:clamp(1.7rem, 7vw, 2.4rem);grid-template-columns:repeat(2, var(--crest));grid-auto-rows:var(--crest);flex:none;gap:1px;display:grid}.crest-cell{background:var(--paper);box-shadow:0 0 0 1px var(--rule);font-family:var(--hand);place-items:center;font-size:1.25rem;font-weight:600;line-height:1;display:grid}.crest-cross{background:var(--mark);color:#1c2a4a}.brand{font-family:var(--hand);letter-spacing:.01em;white-space:nowrap;font-size:clamp(1.2rem,5.2vw,2.25rem);font-weight:600;line-height:1.15}.lead{color:var(--muted);margin-top:.35rem;font-size:.9375rem;line-height:1.6}.monkey{flex:none;width:clamp(2.85rem,13.5vw,5.75rem)}.monkey svg{width:100%;height:auto;display:block}.mode{box-shadow:0 0 0 1px var(--rule);background:var(--rule);grid-template-columns:repeat(4,1fr);gap:1px;display:grid}.mode-option{background:var(--paper);cursor:pointer;border:0;justify-items:center;padding:.55rem .25rem;display:grid}.mode-label{white-space:nowrap;font-size:clamp(.8125rem,3.5vw,1rem);font-weight:700;line-height:1.85}.mode-option[aria-pressed=true]{background:var(--ink);color:var(--on-ink)}.mode-option:focus-visible{outline-offset:-4px;outline-color:var(--red)}.reward-links{background:var(--paper);box-shadow:0 0 0 1px var(--rule);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.6rem 1rem;padding:.85rem 1.15rem;display:flex}.reward-buttons{flex-wrap:wrap;gap:.5rem;display:flex}.account{border-top:1px solid var(--rule-soft);justify-items:start;gap:.6rem;padding-top:1rem;display:grid}.account-note{color:var(--muted);max-width:38rem;font-size:.9375rem}.account-state{flex-wrap:wrap;align-items:baseline;gap:.25rem .75rem;display:flex}.account-status{color:var(--muted);font-size:.875rem}.account-status.is-offline,.account-error{color:var(--red);font-size:.875rem}.section-note{color:var(--muted);margin-top:.15rem;font-size:.9375rem}.tiles{grid-template-columns:repeat(auto-fill,minmax(13.5rem,1fr));gap:.75rem;margin-top:.75rem;display:grid}.tile{border:0;border-left:.5rem solid var(--rule);background:var(--paper);min-width:0;box-shadow:0 0 0 1px var(--rule);text-align:left;cursor:pointer;border-radius:0;align-content:start;justify-items:start;gap:.15rem;padding:.85rem 1rem .9rem;transition:background-color .15s;display:grid;position:relative;overflow:hidden}.tile:hover{background:var(--mark-soft)}.tile-badge{color:var(--muted);font-size:.75rem;font-weight:700;line-height:1.3}.tile-title{font-family:var(--hand);font-size:1.325rem;font-weight:600;line-height:1.35}.tile-meta{color:var(--muted);margin-top:.1rem;font-size:.8125rem;line-height:1.5}.tile-record{border-top:1px solid var(--rule-soft);width:100%;margin-top:.5rem;padding-top:.4rem;font-size:.8125rem;font-weight:700;line-height:1.4}.tile-record b{font-family:var(--hand);font-size:1.1875rem;font-weight:600;line-height:1}.lab-page{max-width:50rem;margin:0 auto;padding:0 1rem 3rem}.bar{grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.5rem;padding:.65rem 0;display:grid}.bar h1{text-align:center;white-space:nowrap;text-overflow:ellipsis;font-size:clamp(1rem,4.2vw,1.4rem);font-weight:700;line-height:1.3;overflow:hidden}.back.home-btn{background:var(--ink);min-height:2.35rem;color:var(--on-ink);white-space:nowrap;cursor:pointer;border:0;border-radius:999px;justify-self:start;align-items:center;gap:.3rem;padding:0 .9rem 0 .65rem;font-size:.875rem;font-weight:700;display:inline-flex}.home-btn span{font-size:1.35em;line-height:1;transform:translateY(-.05em)}.bar-tools{justify-self:end;align-items:center;gap:.35rem;display:flex}.meter{background:var(--paper);box-shadow:0 0 0 1px var(--rule);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.5rem 1rem;padding:.5rem .9rem;display:flex}.submode-tabs{flex-wrap:wrap;gap:.35rem;display:flex}.submode-tab{border:1px solid var(--rule);background:var(--paper);cursor:pointer;border-radius:999px;min-height:2rem;padding:.15rem .75rem;font-size:.8125rem;font-weight:700}.submode-tab[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:var(--on-ink)}.meter-status{align-items:baseline;gap:.75rem;font-size:.875rem;font-weight:700;display:flex}.meter-num{font-family:var(--hand);color:var(--red);font-size:1.35rem;font-weight:600;line-height:1.1}.lab-layout{grid-template-columns:minmax(0,1fr);align-items:start;gap:1rem;margin-top:.85rem;display:grid}.viewport-col{grid-template-columns:minmax(0,1fr);gap:.65rem;min-width:0;display:grid}.viewport-sheet{background-color:var(--paper);width:100%;height:clamp(16.5rem,45dvh,25rem);box-shadow:0 0 0 1px var(--rule);border-left:.5rem solid var(--rule);background-image:linear-gradient(#6aa8932e 1px,#0000 1px),linear-gradient(90deg,#6aa8932e 1px,#0000 1px);background-size:20px 20px;position:relative;overflow:hidden}.canvas-container{touch-action:none;cursor:grab;width:100%;height:100%}.canvas-container:active{cursor:grabbing}.canvas-container canvas{display:block;width:100%!important;height:100%!important}.viewport-overlay-top{pointer-events:none;z-index:2;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.4rem;display:flex;position:absolute;top:.55rem;left:.65rem;right:.65rem}.viewport-badge{pointer-events:auto;background:var(--paper);box-shadow:0 0 0 1px var(--rule);color:var(--ink);align-items:center;gap:.35rem;padding:.2rem .65rem;font-size:.78rem;font-weight:700;display:inline-flex}.viewport-badge.is-alert{background:var(--red-soft);color:var(--red);box-shadow:0 0 0 2px var(--red);animation:.35s shake}.viewport-badge.is-ok{background:var(--mark);color:#1c2a4a;box-shadow:0 0 0 2px var(--ink)}.viewport-cam-btns{pointer-events:auto;gap:.3rem;display:flex}.cam-btn{border:1px solid var(--rule);background:var(--paper);cursor:pointer;border-radius:999px;padding:.2rem .55rem;font-size:.75rem;font-weight:700}.cam-btn:hover{background:var(--mark-soft)}.viewport-overlay-bottom{pointer-events:none;z-index:2;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.35rem;display:flex;position:absolute;bottom:.5rem;left:.65rem;right:.65rem}.viewport-hint{box-shadow:0 0 0 1px var(--rule-soft);color:var(--muted);background:#fdfdfae0;padding:.15rem .55rem;font-size:.75rem}@media (prefers-color-scheme:dark){.viewport-hint{background:#1d2f28e0}}.fold-slider-card{background:var(--paper);box-shadow:0 0 0 1px var(--rule);border-left:.5rem solid var(--ink);gap:.45rem;padding:.75rem 1rem;display:grid}.fold-slider-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.5rem;display:flex}.fold-slider-label{align-items:center;gap:.4rem;font-size:.9375rem;font-weight:700;display:flex}.fold-slider-pct{font-family:var(--hand);background:var(--mark-soft);box-shadow:0 0 0 1px var(--rule);padding:.1rem .5rem;font-size:1.35rem;font-weight:600;line-height:1}.fold-slider-row{grid-template-columns:auto 1fr auto;align-items:center;gap:.6rem;display:grid}.fold-Quick-btn{border:1px solid var(--rule);background:var(--bg);cursor:pointer;white-space:nowrap;border-radius:999px;min-height:2.15rem;padding:0 .65rem;font-size:.8125rem;font-weight:700}.fold-Quick-btn:hover{background:var(--mark-soft)}.fold-range{width:100%;height:2.25rem;accent-color:var(--ink);cursor:pointer;touch-action:pan-x;margin:0}.control-col{grid-template-columns:minmax(0,1fr);gap:.85rem;min-width:0;display:grid}.sheet-card{background:var(--paper);box-shadow:0 0 0 1px var(--rule);border-left:.5rem solid var(--rule);gap:.7rem;min-width:0;padding:1rem 1.15rem;display:grid}.sheet-card.is-highlight{background:var(--mark-soft)}.sheet-title{font-family:var(--hand);justify-content:space-between;align-items:center;gap:.5rem;font-size:1.25rem;font-weight:600;line-height:1.35;display:flex}.sheet-desc{color:var(--ink);font-size:.9375rem;line-height:1.65}.sheet-note{color:var(--muted);font-size:.8125rem;line-height:1.55}.options-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem;display:grid}.options-grid.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.option{background:var(--paper);min-height:3.35rem;box-shadow:0 0 0 1px var(--rule);font-family:var(--hand);cursor:pointer;text-align:center;border:0;border-radius:0;justify-content:center;align-items:center;gap:.4rem;padding:.5rem .65rem;font-size:1.25rem;font-weight:600;line-height:1.3;transition:background-color .15s;display:flex}.option:hover:not(:disabled){background:var(--mark-soft)}.option:disabled{cursor:default;color:var(--muted)}.option.is-selected{background:var(--mark-soft);box-shadow:0 0 0 2px var(--ink)}.option.correct{background:var(--mark);color:#1c2a4a;box-shadow:0 0 0 2px var(--ink);z-index:1}.option.incorrect{background:var(--red-soft);color:var(--red);box-shadow:0 0 0 2px var(--red);animation:.3s shake}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}.feedback-box{background:var(--mark-soft);box-shadow:0 0 0 1px var(--rule);align-items:center;gap:.85rem;padding:.75rem 1rem;display:flex}.feedback-box.is-ng{background:var(--red-soft);box-shadow:0 0 0 1px var(--red)}.feedback-text{flex:1;min-width:0}.feedback-verdict{font-family:var(--hand);color:var(--red);font-size:1.2rem;font-weight:600;line-height:1.3}.feedback-detail{margin-top:.15rem;font-size:.875rem;line-height:1.5}.net-grid-wrap{flex-direction:column;align-items:center;gap:.5rem;display:flex}.net-grid{background:var(--rule);box-shadow:0 0 0 1px var(--rule);aspect-ratio:1;gap:2px;width:min(100%,20rem);padding:2px;display:grid}.net-cell{background:var(--paper);font-family:var(--hand);cursor:pointer;-webkit-user-select:none;user-select:none;border:0;place-items:center;padding:0;font-size:clamp(.95rem,3.5vw,1.25rem);font-weight:600;transition:background-color .12s,transform 80ms;display:grid;position:relative}.net-cell:hover{background:var(--mark-soft)}.net-cell.is-active{background:var(--mark);color:#1c2a4a;box-shadow:inset 0 0 0 2px var(--ink)}.net-cell.is-root{background:var(--mark);color:#1c2a4a;box-shadow:inset 0 0 0 3px var(--ink)}.net-cell.is-stamped{background:var(--mark-soft);box-shadow:inset 0 0 0 2px var(--rule)}.net-cell.is-target{box-shadow:inset 0 0 0 2px dashed var(--rule);background:#6aa8932e}.net-cell-sub{font-size:.65rem;font-family:var(--ui);color:var(--muted);position:absolute;bottom:2px;right:4px}.dpad{grid-template-rows:repeat(2,2.75rem);grid-template-columns:repeat(3,3.2rem);justify-content:center;gap:.4rem;margin:.25rem auto;display:grid}.dpad-btn{border:1px solid var(--rule);background:var(--paper);box-shadow:0 0 0 1px var(--rule);cursor:pointer;place-items:center;font-size:1.05rem;font-weight:700;display:grid}.dpad-btn:hover:not(:disabled){background:var(--mark-soft)}.dpad-btn:active:not(:disabled){background:var(--mark)}.palette-row{flex-wrap:wrap;gap:.4rem;display:flex}.palette-item{border:1px solid var(--rule);background:var(--paper);cursor:pointer;justify-content:center;align-items:center;gap:.25rem;min-width:2.75rem;min-height:2.6rem;padding:.25rem .55rem;font-size:.9375rem;font-weight:700;display:inline-flex}.palette-item.is-selected{background:var(--mark);color:#1c2a4a;box-shadow:0 0 0 2px var(--ink)}.notebook-grid{grid-template-columns:repeat(auto-fill,minmax(6.2rem,1fr));gap:.55rem;display:grid}.notebook-card{background:var(--bg);box-shadow:0 0 0 1px var(--rule-soft);text-align:center;cursor:pointer;border:0;justify-items:center;gap:.25rem;padding:.45rem;display:grid;position:relative}.notebook-card.is-found{background:var(--paper);box-shadow:0 0 0 1px var(--rule)}.notebook-card.is-found:hover{background:var(--mark-soft)}.notebook-mini-grid{grid-template-rows:repeat(5,.7rem);grid-template-columns:repeat(5,.7rem);gap:1px;display:grid}.notebook-mini-cell{background:0 0}.notebook-mini-cell.on{background:var(--rule-soft)}.notebook-card.is-found .notebook-mini-cell.on{background:var(--ink)}.notebook-card-name{color:var(--muted);font-size:.72rem;font-weight:700;line-height:1.25}.notebook-card.is-found .notebook-card-name{color:var(--ink)}.param-row{grid-template-columns:6.5rem 1fr 3.5rem;align-items:center;gap:.5rem;font-size:.875rem;display:grid}.param-label{font-weight:700}.param-val{font-family:var(--hand);text-align:right;font-size:1rem;font-weight:600}.section-preview-box{background:var(--bg);box-shadow:0 0 0 1px var(--rule);align-items:center;gap:1rem;padding:.65rem .9rem;display:flex}.section-shape-badge{font-family:var(--hand);color:var(--red);font-size:1.45rem;font-weight:600}@media (width<=30rem){.home{gap:1.75rem;padding:1.25rem .85rem 3rem}.lab-page{padding:0 .75rem 2.5rem}.viewport-sheet{height:clamp(14.5rem,40dvh,19.5rem)}.options-grid{grid-template-columns:1fr}.options-grid.cols-3{grid-template-columns:repeat(2,minmax(0,1fr))}.param-row{grid-template-columns:5.5rem 1fr 3rem;font-size:.8125rem}.fold-slider-card{padding:.6rem .75rem}}@media (width>=64rem){.home{grid-template-columns:minmax(17.5rem,21.5rem) minmax(0,1fr);align-items:start;column-gap:3rem;max-width:92rem;padding:2.5rem 2rem 3rem}.home-side{position:sticky;top:2rem}.home-side .account{background:var(--paper);box-shadow:0 0 0 1px var(--rule);border-top:0;padding:1rem 1.1rem 1.1rem}.home-side .account-note{font-size:.875rem;line-height:1.65}.hero{flex-direction:column;align-items:flex-start;gap:.9rem;position:relative}.brand{white-space:nowrap;font-size:2rem}.hero .monkey{width:5.75rem;position:absolute;top:-.4rem;right:0}.mode{grid-template-columns:1fr 1fr}.tiles{grid-template-columns:repeat(3,minmax(0,1fr))}.lab-page{max-width:92rem;padding:0 2rem 3rem}.lab-layout{grid-template-columns:minmax(0,1.38fr) minmax(22rem,1fr);gap:1.5rem}.viewport-col{position:sticky;top:.75rem}.viewport-sheet{height:clamp(22rem,100dvh - 13.5rem,36rem)}}@media (prefers-reduced-motion:reduce){.hanamaru.is-drawn polyline,.option.incorrect,.viewport-badge.is-alert{animation:none}}
