:root{--card: 160px}body{min-height:100dvh;display:flex;flex-direction:column;background-color:var(--surface-base);background-image:radial-gradient(120% 60% at 50% 0%,var(--surface-glow),transparent 62%),linear-gradient(180deg,var(--surface-shade-a),var(--surface-shade-b));background-attachment:fixed}body{--surface-base: #fbfaf8;--surface-glow: rgba(255, 255, 255, 0.95);--surface-shade-a: rgba(23, 24, 22, 0.015);--surface-shade-b: rgba(23, 24, 22, 0.085);--checker: rgba(23, 24, 22, 0.07)}body[data-surface=slate]{--surface-base: #8d94a0;--surface-glow: rgba(255, 255, 255, 0.28);--surface-shade-a: rgba(23, 24, 22, 0.02);--surface-shade-b: rgba(23, 24, 22, 0.16);--paper-raised: rgba(255, 255, 255, 0.14);--line: rgba(23, 24, 22, 0.28)}body[data-surface=dark]{--surface-base: #2b2c2a;--surface-glow: rgba(255, 255, 255, 0.1);--surface-shade-a: rgba(0, 0, 0, 0.05);--surface-shade-b: rgba(0, 0, 0, 0.3);--ink: #f1ede3;--ink-soft: #cfc9bb;--warm-grey: #9b9488;--line: rgba(241, 237, 227, 0.26);--paper-raised: rgba(255, 255, 255, 0.07);--on-dark: #21221f;--red-ink: #ef8a67;--checker: rgba(241, 237, 227, 0.1)}body[data-surface=dark] .views button[aria-pressed=true],body[data-surface=dark] .sizes button[aria-pressed=true]{box-shadow:inset 0 -1.5px 0 var(--ink)}body[data-surface=dark] .table--free .thing--cut img{filter:drop-shadow(0 6px 6px rgba(0,0,0,0.55)) drop-shadow(0 0 1px rgba(255,255,255,0.35))}.surfaces{display:flex;gap:0.4rem;align-items:center}.surfaces button{width:22px;height:22px;min-height:22px;padding:0;border:1px solid var(--line);box-shadow:none}.surfaces button[aria-pressed=true]{outline:1.5px solid var(--ink);outline-offset:2px}.surfaces button:hover:not(:disabled){border-color:var(--ink)}.bar{position:sticky;top:0;z-index:2;display:flex;align-items:baseline;gap:var(--space-3);flex-wrap:wrap;padding:0.7rem 1rem 0.55rem;background:transparent}.count{font-family:var(--font-display);font-size:1.15rem;letter-spacing:-0.03em;margin:0;line-height:1.2}.count b{font-size:1.6rem;font-weight:500;color:var(--red-ink)}.count small{display:block;font-family:var(--font-body);font-size:0.72rem;letter-spacing:0.04em;color:var(--warm-grey);line-height:1.5}.bar__actions{margin-left:auto;display:flex;align-items:center;flex-wrap:wrap;column-gap:1.5rem;row-gap:0.1rem}.views,.sizes{display:flex}.views button,.sizes button{border:0;background:transparent;padding:0 0.1rem;font-family:var(--font-display);letter-spacing:-0.03em;color:var(--warm-grey)}.views button{font-size:1.05rem}.sizes button{font-size:0.92rem}.views button[aria-pressed=true],.sizes button[aria-pressed=true]{color:var(--ink);box-shadow:inset 0 -1.5px 0 var(--ink)}.views button,.sizes button,.bar .button{min-height:38px;display:inline-flex;align-items:center}.views button,.sizes button{position:relative}.views button::after,.sizes button::after{content:"";position:absolute;inset:0 -0.4rem}.views,.sizes{gap:0.85rem}.bar .button{border:0;padding:0 0.1rem;font-size:0.8rem;letter-spacing:0.08em;color:var(--warm-grey)}.bar .button:hover{color:var(--ink);background:transparent}.bar .views button:hover:not(:disabled),.bar .sizes button:hover:not(:disabled),.tools button:hover:not(:disabled){background:transparent;color:var(--ink);border-color:transparent}.tools button{border:0;background:transparent;padding:0 0.1rem;min-height:38px;font-size:0.85rem;letter-spacing:0.04em;color:var(--warm-grey)}.tools #knock{font-family:var(--font-display);font-size:1rem;letter-spacing:-0.02em;color:var(--ink);box-shadow:inset 0 -1.5px 0 rgba(23,24,22,0.35)}.button{display:inline-block;border:1px solid var(--line);padding:0.35rem 0.8rem;text-decoration:none;color:inherit;letter-spacing:0.02em}.button:hover{background:var(--ink);color:var(--on-dark);border-color:var(--ink)}.table{flex:1 1 auto;display:flex;flex-wrap:wrap;align-items:flex-end;align-content:flex-start;gap:0.75rem;padding:1rem}.thing{flex:0 1 auto;min-width:0;max-width:100%;height:var(--card);border:1px solid var(--line);background:var(--white);padding:0;cursor:zoom-in}.thing img{display:block;height:100%;width:auto;max-width:min(calc(var(--card) * 3),100%);object-fit:cover}.thing:hover:not(:disabled){border-color:var(--ink);background-color:var(--white);color:inherit}.thing--cut,.thing--cut:hover:not(:disabled){background-color:transparent;border-color:transparent}.table--free{position:relative;display:block;height:calc(100dvh - var(--table-chrome, 190px));min-height:340px;overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent;background:transparent}.table--free .thing{box-shadow:0 8px 12px -7px rgba(23,24,22,0.45)}.table--free .thing:nth-child(6n+1){transform:rotate(-5.5deg)}.table--free .thing:nth-child(6n+2){transform:rotate(3.5deg)}.table--free .thing:nth-child(6n+3){transform:rotate(-2deg)}.table--free .thing:nth-child(6n+4){transform:rotate(7deg)}.table--free .thing:nth-child(6n+5){transform:rotate(-8.5deg)}.table--free .thing:nth-child(6n){transform:rotate(1.5deg)}.table--free .thing[data-dragging=true]{transform:rotate(0deg)}@media(prefers-reduced-motion:reduce){.table--free .thing{transform:none}}.table--free .thing--cut{box-shadow:none}.table--free .thing--cut img{filter:drop-shadow(0 6px 5px rgba(23,24,22,0.34)) drop-shadow(0 1px 0 rgba(23,24,22,0.14))}.thing--free{position:absolute;cursor:grab}.thing--free.is-dragging{cursor:grabbing}.thing--picked{outline:2px solid var(--red);outline-offset:-1px}.thing__scale{position:absolute;right:-7px;bottom:-7px;width:15px;height:15px;padding:0;border:1px solid var(--ink);background:var(--paper);cursor:nwse-resize}.thing__layers{position:absolute;left:-1px;top:-1px;display:flex}.thing__layers button{width:20px;height:20px;padding:0;font-size:0.6rem;line-height:1;border:0;background:rgba(23,24,22,0.8);color:var(--on-dark)}.thing__layers button:hover{background:var(--red);color:var(--white)}.tools{padding:0.55rem 1rem 0.6rem;border-bottom:1px solid var(--line);background:var(--paper-raised)}.tools__row{display:flex;align-items:center;flex-wrap:wrap;column-gap:1.5rem;row-gap:0.2rem}.tools__row button{min-height:40px;padding:0 0.1rem;font-size:0.82rem;white-space:nowrap}.tools__pair{display:flex;gap:0;margin-left:-1.1rem}.tools__pair button{min-width:40px;padding:0;font-size:1rem}.tools__say,.tools__how{margin:0.45rem 0 0;max-width:none;font-size:0.74rem;line-height:1.6;color:var(--ink-soft)}.tools__say:empty{display:none}.tools__how{color:var(--warm-grey)}.thing--cut{background-color:transparent;background-image:linear-gradient(45deg,var(--checker) 25%,transparent 25%),linear-gradient(-45deg,var(--checker) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,var(--checker) 75%),linear-gradient(-45deg,transparent 75%,var(--checker) 75%);background-size:12px 12px;background-position:0 0,0 6px,6px -6px,-6px 0;border-color:transparent}.table--free .thing--cut,.drawer__slot .thing--cut{background-image:none}.drawer__slot .thing--cut img{filter:drop-shadow(0 3px 3px rgba(23,24,22,0.3))}.drawer{border-top:1px solid rgba(23,24,22,0.1);background-color:transparent;background-image:linear-gradient(180deg,rgba(23,24,22,0.035),rgba(23,24,22,0.085));padding:0.55rem 1rem 0.75rem}.drawer__label{margin:0 0 0.4rem;max-width:none;font-family:var(--font-display);font-size:0.95rem;letter-spacing:-0.02em;color:var(--ink)}.drawer__label small{font-family:var(--font-body);font-size:0.7rem;letter-spacing:0.04em;margin-left:0.6rem;color:var(--warm-grey)}.drawer__slot{user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent;display:flex;align-items:center;gap:0.5rem;min-height:72px;padding:0.4rem;overflow-x:auto;background:rgba(23,24,22,0.05);box-shadow:inset 0 2px 5px rgba(23,24,22,0.14)}.drawer__slot:empty::after{content:"\628a\9996\98fe\3001\5c0f\6771\897f\62d6\9032\4f86";font-size:0.74rem;color:var(--warm-grey);padding-left:0.4rem}.drawer.is-target .drawer__slot{outline:2px solid var(--yellow);outline-offset:-2px}.drawer__slot .thing{height:60px;cursor:grab;box-shadow:none}.drawer__slot .thing img{height:58px}.ghost{position:fixed;z-index:50;pointer-events:none;opacity:0.9;filter:drop-shadow(0 8px 10px rgba(23,24,22,0.4))}.empty{flex:1 1 auto;display:grid;align-content:center;justify-items:center;padding:clamp(1.5rem,7vw,3.5rem);text-align:left}body:has(#empty:not([hidden])) .bar{border-bottom-color:transparent;background:transparent}body:has(#empty:not([hidden])) .bar__actions{display:none}.empty__top{display:grid;justify-items:start;text-align:left;gap:var(--space-3);width:min(24rem,100%);padding:0}.empty h1{font-size:clamp(1.8rem,1.1rem + 3vw,3rem);line-height:1.1;letter-spacing:-0.05em;margin:0}.empty p{max-width:34ch;margin:0;color:var(--ink-soft);text-wrap:pretty}.empty h1{text-wrap:balance}.button--big{border-color:var(--ink);background:var(--ink);color:var(--on-dark);padding:0.7rem 1.6rem}.button--big:hover{background:var(--red);border-color:var(--red)}.foot{border-top:1px solid var(--line);padding:0.7rem 1rem}.foot p{margin:0;max-width:none;font-size:0.78rem;line-height:1.7;color:var(--ink-soft)}.privacy{font-size:0.7rem!important;letter-spacing:0.03em;color:var(--warm-grey)!important}.privacy--back a{color:var(--ink-soft);text-decoration-color:var(--line);text-underline-offset:0.2em}.privacy--back a:hover{color:var(--red);text-decoration-color:currentColor}.look{position:fixed;inset:0;z-index:5;display:grid;place-items:center;gap:var(--space-2);padding:var(--space-3);background:rgba(18,19,16,0.92)}.look img{max-width:min(92vw,900px);max-height:66vh;border:1px solid rgba(243,239,228,0.4);background:#9aa0a4}.look__close{position:absolute;top:12px;right:12px;width:34px;height:34px;padding:0;color:var(--on-dark);border-color:rgba(243,239,228,0.5)}.look__tools{display:flex;align-items:center;gap:0.35rem;flex-wrap:wrap;justify-content:center}.look__tools button{color:var(--on-dark);border-color:rgba(243,239,228,0.5);font-size:0.8rem;min-width:44px;min-height:38px}.look__tools em{font-style:normal;font-size:0.74rem;color:rgba(243,239,228,0.75)}.look__kill{color:var(--on-dark);border-color:rgba(243,239,228,0.5)}.look__kill:hover{background:var(--red);border-color:var(--red);color:var(--white)}@media(max-width:640px){.bar__actions{margin-left:0;width:100%}.views{flex:1 0 100%}.bar .button{margin-left:auto}.table{gap:0.5rem;padding:0.7rem}}.doing{margin:0;padding:0.5rem 1rem;max-width:none;font-size:0.78rem;letter-spacing:0.04em;color:var(--ink-soft);background:var(--paper-raised);border-bottom:1px solid var(--line)}.tools__done{margin:0.5rem 0 0;max-width:none}.tools__done button{border:0;background:transparent;padding:0 0.1rem;min-height:40px;font-family:var(--font-display);font-size:1rem;letter-spacing:-0.02em;color:var(--ink);box-shadow:inset 0 -1.5px 0 var(--ink)}.tools__done button:disabled{color:var(--warm-grey);box-shadow:inset 0 -1.5px 0 var(--line)}.tools__review{margin:0.35rem 0 0;max-width:none}.tools__review button{border:0;background:transparent;padding:0;min-height:38px;font-family:var(--font-display);font-size:0.98rem;letter-spacing:-0.02em;color:var(--red-ink);box-shadow:inset 0 -1.5px 0 rgba(184,73,42,0.45)}.tools__review button:hover:not(:disabled){background:transparent;color:var(--red)}.look__why{margin:0 0 0.9rem;max-width:34ch;font-size:0.86rem;line-height:1.75;color:var(--ink-soft);text-wrap:pretty}.look__decide{display:flex;gap:0.6rem;margin-bottom:0.9rem;flex-wrap:wrap}.look__decide button{min-height:44px;padding:0 1.1rem}.look__decide #look-keep{border-color:var(--ink);background:var(--ink);color:var(--on-dark)}.look:has(#look-decide:not([hidden])) #look-img{background-color:#fbfaf8;background-image:linear-gradient(45deg,rgba(23,24,22,0.07) 25%,transparent 25% 75%,rgba(23,24,22,0.07) 75%),linear-gradient(45deg,rgba(23,24,22,0.07) 25%,transparent 25% 75%,rgba(23,24,22,0.07) 75%);background-size:16px 16px;background-position:0 0,8px 8px;border:1px solid rgba(243,239,228,0.35);max-height:46vh;min-width:180px;min-height:180px;object-fit:contain}.figure{position:absolute;left:50%;top:50%;height:88%;width:auto;aspect-ratio:200 / 520;pointer-events:none;z-index:0;transform:translate(-50%,-50%) scaleY(var(--figure-h, 1)) scaleX(calc(var(--figure-h, 1) * var(--figure-w, 1)));transform-origin:center}.table--body .thing{z-index:1}.table--body .thing{transform:none}.shape{margin:0.45rem 0 0;font-size:0.8rem;color:var(--warm-grey)}.shape summary{cursor:pointer;min-height:38px;display:flex;align-items:center;letter-spacing:0.06em;color:var(--ink-soft)}.shape label{display:flex;align-items:center;gap:0.6rem;margin:0.2rem 0;max-width:22rem}.shape input[type=range]{flex-grow:1;accent-color:var(--ink)}.shape p{margin:0.5rem 0 0;max-width:34ch;font-size:0.76rem;line-height:1.7;color:var(--warm-grey);text-wrap:pretty}
