:root{color:#060605;font-synthesis:none;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--paper:#f0ede1;--ink:#060605;--accent:#c2362b;--muted:#5b584f;--line:#bbb5a7;--surface:#f8f5ec;--response-ink:#fffaf0;--paper-texture:url(../textures/paper-fiber-v1.png);background:#f0ede1;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Microsoft JhengHei,sans-serif}*{box-sizing:border-box;scrollbar-color:var(--line) var(--paper);scrollbar-width:thin}body{background:var(--paper);isolation:isolate;margin:0}body:before{content:"";z-index:-1;background-image:var(--paper-texture);mix-blend-mode:multiply;opacity:.42;pointer-events:none;background-size:512px 512px;position:fixed;inset:0}.card-stock{background-image:var(--paper-texture);mix-blend-mode:multiply;opacity:.4;pointer-events:none;z-index:0;background-size:256px 256px;display:block;position:absolute;inset:0}button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer;background:var(--surface);-webkit-tap-highlight-color:transparent;border:1px solid #66645a;border-radius:0;min-height:48px;padding:.8rem 1rem;transition:background .14s,color .14s,transform .18s cubic-bezier(.16,1,.3,1)}button:hover{background:#eae5d7}button:active{background:#e2dccb}button[aria-pressed=true],button.primary{background:var(--accent);border-color:var(--accent);color:var(--response-ink)}button:disabled{opacity:.5;cursor:default}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid var(--accent);outline-offset:4px}::selection{background:var(--accent);color:var(--response-ink)}input,textarea{caret-color:var(--accent)}input::placeholder,textarea::placeholder{color:var(--muted);opacity:1}h1{letter-spacing:-.025em;text-wrap:balance;margin:0 0 12px;font-size:2rem;line-height:1.2}p{line-height:1.6}small{line-height:1.5}svg,button small{display:block}[data-color=blue]{--choice-color:#195fa8}[data-color=orange]{--choice-color:#a9470a}[data-color=green]{--choice-color:#24714b}[data-color=purple]{--choice-color:#7547a3}[data-color=red]{--choice-color:#b82d35}[data-color=teal]{--choice-color:#146d78}[data-color=pink]{--choice-color:#a53670}[data-color=slate]{--choice-color:#475569}.app-shell{max-width:1040px;min-height:100dvh;padding:max(28px,env(safe-area-inset-top)) max(20px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left));margin:auto;position:relative}.home-heading{border-bottom:1px solid var(--ink);margin-bottom:24px;padding:8px 0 28px}.home-heading p,.tool-heading p{color:var(--muted);max-width:70ch;margin:0}.home-heading h1:focus,.tool-heading h1:focus{outline:none}.tool-heading{margin-bottom:24px}.navigation{justify-content:space-between;align-items:center;gap:12px;margin-bottom:20px;display:flex}.back{background:0 0;border:0;align-items:center;gap:4px;padding:0 8px 0 0;display:flex}.back svg,.take-arrow{fill:none;stroke:currentColor;stroke-width:1.8px;flex-shrink:0;width:24px;height:24px}.home-link{background:0 0;border:0;padding:.5rem}.breadcrumb{color:var(--muted);align-items:center;gap:8px;margin-bottom:12px;font-size:.875rem;display:flex}.breadcrumb button{text-underline-offset:3px;background:0 0;border:0;min-height:32px;padding:0;text-decoration:underline}.category-gallery,.set-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 24px;display:grid}.gallery-card,.set-card{text-align:left;border:0;border-bottom:1px solid var(--ink);background:0 0;flex-direction:column;gap:8px;min-width:0;padding:0 0 18px;display:flex}.gallery-card:hover,.set-card:hover,.gallery-card:active,.set-card:active{background:0 0}.gallery-name{justify-content:space-between;align-items:center;gap:8px;width:100%;display:flex}.gallery-name strong{font-size:1.2rem;line-height:1.3}.gallery-card>small,.set-card>small{color:var(--muted);font-size:.875rem;font-weight:400}.gallery-card:hover .take-arrow,.set-card:hover .take-arrow{transform:translate(3px)}.take-arrow{transition:transform .18s cubic-bezier(.16,1,.3,1)}.mini-cards{--count:4;--card-width:78px;--card-height:108px;--stride:24px;isolation:isolate;width:100%;height:144px;margin-bottom:4px;position:relative}.mini-cards[data-count="2"]{--count:2;--stride:44px}.mini-cards[data-count="3"]{--count:3;--stride:30px}.sample-face{--turn:calc((var(--slot) - (var(--count) - 1) / 2) * 9deg);left:calc(50% - var(--card-width) / 2 + (var(--slot) - (var(--count) - 1) / 2) * var(--stride));width:var(--card-width);height:var(--card-height);z-index:var(--slot);background:var(--choice-color);color:var(--response-ink);transform:rotate(var(--turn));transform-origin:50% 90%;transition:transform .2s cubic-bezier(.16,1,.3,1);position:absolute;top:16px}.sample-face:after,.choice-button:after{content:"";opacity:.35;pointer-events:none;z-index:2;border:1px solid;position:absolute;inset:6px}.sample-face b{font-size:var(--sample-font);white-space:nowrap;z-index:1;font-weight:800;line-height:1.1;position:absolute;top:19px;left:11px;right:9px}.sample-face:before{content:attr(data-mark);z-index:2;max-width:calc(100% - 20px);font-size:9px;font-weight:700;position:absolute;bottom:10px;right:10px;transform:rotate(180deg)}.sample-face .answer-icon{stroke-width:3px;width:34px;height:34px}@media (hover:hover){.gallery-card:hover .sample-face,.set-card:hover .sample-face{transform:translateY(-5px) rotate(calc(var(--turn) * 1.15))}}.gallery-card:active .sample-face,.set-card:active .sample-face{transform:translateY(3px) rotate(calc(var(--turn) * .8))}.making-preview{width:100%;height:144px;margin-bottom:4px;position:relative}.preview-board{background:var(--surface);border:1px solid #66645a;width:76%;height:99px;padding:16px;position:absolute;top:18px;left:6%;transform:rotate(-6deg)}.preview-board>span:not(.card-stock){font-size:24px;font-weight:700;position:relative}.preview-board svg{fill:none;width:90%;height:24px;stroke:var(--ink);stroke-width:1.8px;margin-top:8px}.preview-order{gap:4px;display:flex;position:absolute;bottom:18px;right:0;transform:rotate(5deg)}.preview-order span{background:var(--paper);border:1px solid #66645a;place-items:center;width:32px;height:40px;font-size:20px;font-weight:750;display:grid}.answer-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;display:grid}.choice-button{isolation:isolate;background:var(--choice-color);border-color:var(--choice-color);color:var(--response-ink);flex-direction:column;justify-content:center;align-items:center;min-width:0;min-height:168px;padding:30px 12px;display:flex;position:relative}.choice-button:before{content:attr(data-mark);z-index:2;font-size:11px;font-weight:650;line-height:1.2;position:absolute;top:13px;left:14px}.choice-button>strong,.choice-button>small,.choice-button>svg{z-index:1;position:relative}.choice-button strong{overflow-wrap:anywhere;font-size:clamp(28px,11vw,72px);font-weight:800;line-height:1.15;display:block}.choice-button small{color:inherit;margin-top:10px;font-size:clamp(14px,3vw,18px);font-weight:500}.choice-button:hover{background:var(--choice-color);filter:brightness(.94);transform:translateY(-2px)}.choice-button:active{background:var(--choice-color);filter:brightness(.88);transform:translateY(4px)scale(.96)}.choice-button:focus-visible{outline-color:var(--ink)}.choice-button[aria-pressed=true]{background:var(--choice-color);border-color:var(--choice-color);outline:3px solid var(--ink);outline-offset:3px}.current-choice{z-index:2;font-size:14px;font-weight:650;position:absolute;top:12px;right:14px}.conditional-row .current-choice{margin-top:6px;line-height:1.4;display:block;position:relative;inset:auto}.answer-icon{fill:none;stroke:currentColor;stroke-width:4px;stroke-linecap:round;stroke-linejoin:round;width:80px;height:80px;margin:auto}.answer-grid.two strong{font-size:clamp(28px,8vw,48px)}.answer-grid.three{grid-template-columns:1fr}.answer-grid.three .choice-button{min-height:110px;padding:28px 12px}.answer-grid.three strong{font-size:clamp(28px,8vw,48px)}.answer-grid.many .choice-button{min-height:110px;padding:30px 10px}.answer-grid.many strong{font-size:clamp(23px,7vw,42px)}.conditional-row{grid-template-columns:minmax(0,1fr) 28px minmax(0,1fr);align-items:stretch;gap:6px;margin-bottom:12px;display:grid}.conditional-row .choice-button{min-height:118px;padding:24px 8px 16px}.conditional-row strong{font-size:clamp(22px,6vw,38px);line-height:1.2}.conditional-row small{margin-top:8px;font-size:14px;line-height:1.4}.pair-arrow{fill:none;width:24px;height:100%;stroke:var(--muted);stroke-width:1.6px}.step-navigation{gap:12px;margin-top:22px;display:flex}.step-navigation button{flex:1}.hint{color:var(--muted);margin:18px 0;font-size:.9375rem}.segments{gap:0;margin:12px 0 18px;display:flex}.segments button{flex:1;min-width:0;padding:.7rem .3rem}.segments button+button{border-left:0}.entry{margin:18px 0;display:block}.entry>span{margin-bottom:8px;display:block}.entry input,.entry textarea{background:var(--surface);border:1px solid #66645a;border-radius:0;width:100%;padding:14px;font-size:1.25rem;line-height:1.6;display:block}.entry textarea{resize:vertical}.entry small{text-align:right;color:var(--muted);font-variant-numeric:tabular-nums;display:block}.action-row{justify-content:space-between;gap:12px;margin-top:22px;display:flex}.action-row .primary{flex:1}.pen-tools{flex-wrap:wrap;gap:8px;margin:20px 0 12px;display:flex}.pen-tools button{padding:.6rem .7rem}.draw-pad{background:var(--surface);border:1px solid #66645a}.drawing{object-fit:contain;width:100%;height:100%;max-height:100%}.editable{aspect-ratio:1000/640;touch-action:none;cursor:crosshair}.count-field{align-items:center;gap:16px;margin:22px 0;display:flex}.count-field select{background:var(--surface);border:1px solid #66645a;border-radius:0;min-width:90px;padding:12px}.word-entry small{color:var(--muted);margin-top:8px;display:block}.tokens{flex-wrap:wrap;gap:12px;min-height:78px;padding:12px 0;display:flex}.tokens button{touch-action:none;-webkit-user-select:none;user-select:none;overflow-wrap:anywhere;min-width:64px;min-height:72px;font-size:1.5rem;font-weight:650}.tokens .drop-target{outline:3px solid var(--accent);outline-offset:3px}.cache-note{border-top:1px solid var(--line);color:var(--muted);margin-top:32px;padding:16px 0 0;font-size:.875rem}.cache-note p{margin:0 0 12px}.cache-note p[data-cache=ready]:before{content:"";vertical-align:1px;background:#24714b;width:7px;height:7px;margin-right:8px;display:inline-block}.cache-note details p{max-width:70ch;margin-top:12px}.cache-note summary{cursor:pointer;min-height:44px;padding:12px 0;display:list-item}.cache-error{color:#9a2922}.answer-confirmation{border-top:1px solid var(--line);background:var(--paper);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-top:20px;padding:16px 0;display:flex}.answer-confirmation p{margin:0;font-size:16px}.answer-confirmation button{min-width:140px}@media (width<=420px){.answer-confirmation button{width:100%}}.exhibit{background:var(--ink);width:100%;height:100dvh;color:var(--paper);padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);isolation:isolate;position:fixed;inset:0;overflow:hidden;container-type:size}.exhibit[data-color]{background:var(--choice-color);color:var(--response-ink)}.display-surface{color:inherit;cursor:pointer;background:0 0;border:0;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;padding:5vh 5vw 64px;display:flex;position:relative;overflow:hidden}.display-surface .card-stock{opacity:.18;background-size:384px 384px}.display-surface>:not(.card-stock){z-index:1;position:relative}.display-surface:after{content:"";opacity:.35;pointer-events:none;z-index:2;border:1px solid;position:absolute;inset:14px 14px 64px}.display-surface:before{content:attr(data-mark);z-index:2;font-size:20px;font-weight:650;position:absolute;top:28px;left:30px}.display-surface:hover,.display-surface:active{background:0 0}.display-surface:focus-visible{outline-offset:-8px;outline:3px solid}.response-content{text-align:center;width:100%;font-weight:800;line-height:1.05;animation:.24s cubic-bezier(.16,1,.3,1) both take-card}.response-content strong{font:inherit;letter-spacing:-.025em;white-space:nowrap;display:block}.response-content small{margin-top:18px;font-size:clamp(16px,5vmin,42px);font-weight:500;line-height:1.4;display:block}.response-content .answer-icon{stroke-width:3px;width:min(75vw,65vh);height:min(75vw,65vh)}@keyframes take-card{0%{transform:translateY(10px)scale(.96)}to{transform:translateY(0)scale(1)}}.display-foot{bottom:max(12px,env(safe-area-inset-bottom));left:max(20px,env(safe-area-inset-left));right:max(16px,env(safe-area-inset-right));color:inherit;pointer-events:none;justify-content:space-between;align-items:center;font-size:13px;display:flex;position:absolute}.layout-toggle{pointer-events:auto;color:inherit;background:0 0;border:1px solid;min-height:44px;padding:8px 12px;font-size:13px}.layout-toggle:hover,.layout-toggle:active{background:#fffaf014}.layout-toggle:focus-visible{outline-color:currentColor}.whiteboard-text{white-space:pre-wrap;overflow-wrap:anywhere;text-align:center;max-width:100%;max-height:100%;font-weight:700;line-height:1.4}.display-surface .drawing{background:var(--surface);max-width:1000px;max-height:calc(100dvh - 90px)}.display-sequence{align-items:stretch;gap:8px;width:100%;max-height:100%;margin:0;padding:0;font-weight:750;line-height:1.4;list-style:none;display:grid}.display-sequence li{border:1px solid var(--line);overflow-wrap:anywhere;justify-content:center;align-items:center;min-width:0;padding:6px 8px;display:flex}@media (width>=600px){.app-shell{padding:40px}.category-gallery,.set-gallery[data-count="4"]{grid-template-columns:repeat(4,minmax(0,1fr))}.set-gallery[data-count="6"]{grid-template-columns:repeat(3,minmax(0,1fr))}.mini-cards{--card-width:96px;--card-height:134px;--stride:28px;height:176px}.mini-cards[data-count="3"]{--stride:38px}.mini-cards[data-count="2"]{--stride:56px}.sample-face b{font-size:calc(var(--sample-font) * 1.25);top:22px;left:14px;right:10px}.sample-face:before{font-size:10px}.making-preview{height:176px}.preview-board{height:128px;padding:20px}.preview-board>span:not(.card-stock){font-size:30px}.preview-order{bottom:22px}.preview-order span{width:38px;height:48px;font-size:24px}.answer-grid .choice-button{min-height:210px}.answer-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.answer-grid.many{grid-template-columns:repeat(4,minmax(0,1fr))}}@media (width>=600px) and (width<=850px){.category-gallery,.set-gallery[data-count="4"]{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=359px){.app-shell{padding-left:16px;padding-right:16px}h1{font-size:1.75rem}.category-gallery,.set-gallery{column-gap:16px}.mini-cards{--card-width:68px;--card-height:100px;--stride:19px;height:134px}.mini-cards[data-count="3"]{--stride:25px}.mini-cards[data-count="2"]{--stride:34px}.sample-face b{font-size:calc(var(--sample-font) * .83);left:9px}.gallery-name strong{font-size:1.05rem}.gallery-name .take-arrow{width:20px}.making-preview{height:134px}.preview-order span{width:28px}.answer-grid{gap:12px}.answer-grid .choice-button{min-height:142px}.conditional-row{grid-template-columns:minmax(0,1fr) 22px minmax(0,1fr);gap:4px}.conditional-row strong{font-size:21px}.pair-arrow{width:20px}}@media (orientation:landscape) and (height<=500px){.app-shell{padding-top:20px}.category-gallery,.set-gallery[data-count="4"]{grid-template-columns:repeat(4,minmax(0,1fr))}.set-gallery[data-count="6"]{grid-template-columns:repeat(3,minmax(0,1fr))}.answer-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.answer-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.answer-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.answer-grid .choice-button{min-height:110px}.tool-heading{margin-bottom:16px}.navigation,.conditional-row{margin-bottom:8px}.conditional-row .choice-button{min-height:90px;padding:24px 6px 12px}.conditional-row strong{font-size:26px}.conditional-row small{margin-top:4px}}@media (orientation:portrait) and (height<=650px){.tool-heading{margin-bottom:16px}.navigation{margin-bottom:12px}.conditional-row .choice-button{min-height:82px;padding:21px 4px 8px}.conditional-row{margin-bottom:8px}.conditional-row strong{font-size:21px}.conditional-row small{margin-top:4px;font-size:12px}.conditional-row .choice-button:before{font-size:9px;top:9px;left:10px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}