:root{color:#28271f;background:#ded6c1;font-family:DM Mono,monospace;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-width:320px}button,input{font:inherit}button{color:inherit}main{position:relative;min-height:100vh;overflow:hidden;padding:20px 16px 42px;background:radial-gradient(circle at 50% -10%,#fff8e8,transparent 42%),#ded6c1}.grain{position:fixed;z-index:0;inset:0;pointer-events:none;opacity:.23;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.34'/%3E%3C/svg%3E");mix-blend-mode:multiply}.shell{position:relative;z-index:1;width:min(980px,100%);margin:auto}.back{display:inline-block;color:#5a5b42;font-size:11px;text-decoration-thickness:1px;text-underline-offset:4px}header{padding:38px 6px 20px;text-align:center}header p{margin:0 0 10px;color:#71735d;font-size:9px;letter-spacing:.18em}h1,h2,.factory-sign b{font-family:Kaisei Decol,serif;font-weight:400}h1{margin:0;color:#3a3c2e;font-size:clamp(42px,8vw,76px);letter-spacing:.22em;text-indent:.22em;line-height:1.15}header span{display:block;margin-top:11px;color:#696b53;font-family:Yomogi,cursive;font-size:clamp(15px,2.6vw,21px)}.factory{position:relative;overflow:hidden;min-height:280px;border:2px solid #3e4435;background:#b9c1ab;box-shadow:7px 8px #8f9179,0 16px 35px #77725d55}.factory:before{content:"";position:absolute;inset:0;opacity:.23;background:repeating-linear-gradient(90deg,transparent 0 30px,#f7f0d9 31px 32px),repeating-linear-gradient(0deg,transparent 0 19px,#48513e 20px 21px)}.factory svg{position:absolute;inset:15px 0 0;width:100%;height:calc(100% - 15px)}.factory-sign{position:absolute;z-index:2;top:0;left:0;display:flex;align-items:center;gap:12px;width:100%;min-height:33px;padding:5px 12px;color:#ededd9;background:#3e4435;text-shadow:1px 1px #1f271f}.factory-sign span,.factory-sign i{font-size:8px;font-style:normal;letter-spacing:.1em}.factory-sign b{font-size:14px;letter-spacing:.22em}.factory-sign i{margin-left:auto}.factory-wall,.factory-floor,.station rect,.station path,.belt path,.factory-pipes path,.factory-pipes circle,.factory-workers path,.factory-workers circle,.factory-crate path{fill:none;stroke:#42503d;stroke-width:3;stroke-linejoin:round;stroke-linecap:round}.factory-wall{fill:#d3d5b9}.factory-floor{stroke-width:5}.station{opacity:.58;transition:opacity .3s ease,transform .3s ease}.station--on{opacity:1}.station--on rect{fill:#f5e39a}.station text{fill:#40503d;font:12px DM Mono,monospace;text-anchor:middle}.station-scribble{stroke:#7c6341!important;stroke-width:2!important}.factory-pipes{opacity:.6}.factory-workers{fill:#f2d9a0}.factory-crate{fill:#bb8c5c}.belt{stroke:#615746}.belt-tick{transform:translate(var(--tick))}.factory--running .belt-tick{animation:belt 1.18s linear infinite}.factory--running .station--on{animation:station-buzz .72s steps(2,end) infinite}.factory--running .factory-workers{animation:worker-nod .58s ease-in-out infinite alternate;transform-origin:center bottom}.factory-part{position:absolute;z-index:3;left:7.5%;bottom:17px;width:150px;animation:conveyor-idle 3.4s ease-in-out infinite}.factory--running .factory-part{animation:conveyor-run 4.9s linear infinite}.factory-lamps{position:absolute;z-index:3;top:43px;right:14px;display:flex;gap:5px}.factory-lamps i{width:7px;height:7px;border:1px solid #374332;border-radius:50%;background:#e2ba56;box-shadow:0 0 4px #e2ba56;animation:lamp 1.5s infinite}.factory-lamps i:nth-child(2){animation-delay:.2s}.factory-lamps i:nth-child(3){animation-delay:.4s}@keyframes belt{to{transform:translate(43px)}}@keyframes station-buzz{50%{transform:translateY(-2px)}}@keyframes worker-nod{to{transform:rotate(1.5deg)}}@keyframes conveyor-idle{50%{transform:translate(11px)}}@keyframes conveyor-run{0%{transform:translate(0)}48%{transform:translate(595%)}52%{opacity:1}54%,to{transform:translate(0);opacity:0}}@keyframes lamp{20%{background:#f6e8a6;box-shadow:0 0 12px #f6e8a6}to{background:#8b7250;box-shadow:none}}.part{display:block;width:100%;max-width:245px;height:auto}.part--small{max-width:150px}.part-shadow{fill:#544f3e55}.part-body{fill:#e9b77c;stroke:#4d4c3d;stroke-width:3;stroke-linejoin:round}.part-wave{fill:none;stroke:#925b46;stroke-width:4;stroke-linecap:round}.part-wave--wobble{stroke-dasharray:4 3}.part-wave--margin{transform:translate(8px)}.part-wave--hesitation{stroke-dasharray:1 8}.part-wave--vanity{stroke:#d19837;stroke-width:5}.part-scar{fill:none;stroke:#694d3d;stroke-width:3;stroke-linecap:round}.part-scar--scratch{stroke-width:2}.part-scar--tilt{stroke-dasharray:3 2}.part-freckle{fill:#734d3d}.part-mark{fill:#404c3e;font:25px Yomogi,cursive;text-anchor:middle}.part-glyph{fill:#925b46;font:19px Yomogi,cursive;text-anchor:middle}.part-label{fill:#6e6250;font:7px DM Mono,monospace;text-anchor:middle}.order-sheet,.process-sheet,.rejection,.complete{position:relative;margin-top:25px;padding:clamp(22px,4vw,42px);border:1px solid #767a61;background:#f7f2df;box-shadow:6px 7px #b8b096}.order-sheet:before,.process-sheet:before,.rejection:before{content:"";position:absolute;inset:10px;pointer-events:none;border:1px solid #d1c8aa}.sheet-head,.process-line{position:relative;display:flex;justify-content:space-between;gap:15px;color:#73745c;font-size:10px;letter-spacing:.05em}.sheet-head b,.process-line b{color:#565943;font-weight:400}h2{position:relative;margin:25px 0 9px;color:#393b2d;font-size:clamp(22px,4vw,34px);line-height:1.45}.foreman{position:relative;margin:0 0 21px;color:#6b6c55;font-family:Yomogi,cursive;font-size:17px}.choice-grid{position:relative;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.choice{display:grid;grid-template-columns:48px 1fr;column-gap:10px;align-items:center;min-height:113px;padding:14px;border:1px solid #95957b;border-radius:2px;cursor:pointer;text-align:left;background:#e8e3cf;box-shadow:2px 3px #c7bea3;transition:transform .15s ease,background .15s ease,box-shadow .15s ease}.choice:hover,.choice:focus-visible{outline:0;background:#fcf6d9;box-shadow:4px 5px #9c9478;transform:translate(-2px,-2px) rotate(-.35deg)}.choice:active{transform:translate(1px,2px);box-shadow:none}.choice-glyph{grid-row:1 / span 2;color:#695d45;font-family:Yomogi,cursive;font-size:39px;text-align:center}.choice b{font-family:Yomogi,cursive;font-size:22px;font-weight:400}.choice small{align-self:start;color:#70705c;font-size:9px;line-height:1.6}.ticket{position:relative;display:flex;align-items:center;justify-content:center;gap:9px;margin-top:23px;padding:10px;border-top:1px dashed #9c9b80;border-bottom:1px dashed #9c9b80;color:#62644e;font-family:Yomogi,cursive;font-size:15px;text-align:center}.ticket i{color:#a27945;font-style:normal}.processing-detail{position:relative;display:grid;grid-template-columns:minmax(135px,1fr) 1.6fr;align-items:center;gap:20px;margin:8px 0 18px}.processing-detail .part{justify-self:center;animation:part-breathe .8s ease-in-out infinite alternate}.hand-note{margin:0;color:#6e523a;font-family:Yomogi,cursive;font-size:clamp(17px,2.8vw,23px);line-height:1.8;transform:rotate(-1.2deg)}.hand-note:before{content:"メモ / ";font-family:DM Mono,monospace;font-size:9px;color:#99734e}@keyframes part-breathe{to{transform:translateY(-4px) rotate(1deg)}}ol{position:relative;display:grid;grid-template-columns:repeat(5,1fr);gap:4px;padding:0;margin:12px 0 0;list-style:none}ol li{min-height:62px;padding:8px 7px;border-top:3px solid #c9c0a0;color:#8f8e76;font-size:9px;line-height:1.5}ol li span{display:block;margin-bottom:3px;font-size:8px}ol li.done{border-color:#75876b;color:#4d684e}ol li.now{border-color:#b77a42;color:#775431;background:#f3e6c7}.second-note{position:relative;margin:20px 0 0;padding-top:15px;border-top:1px dashed #a9a184;color:#716047;font-family:Yomogi,cursive;font-size:17px}.rejection{padding-top:72px;border-color:#98594a;background:#f3e2cd}.reject-stamp{position:absolute;top:21px;right:28px;padding:7px 12px;border:3px double #a45748;color:#a45748;font-family:Kaisei Decol,serif;font-size:20px;letter-spacing:.2em;transform:rotate(5deg)}.rejection p{position:relative;color:#795b47;font-size:11px;line-height:1.8}.rejection h2{max-width:650px;color:#794b3d}.primary{position:relative;margin-top:20px;padding:13px 18px;border:1px solid #4b513c;border-radius:0;cursor:pointer;color:#f5eed9;background:#4b513c;box-shadow:3px 4px #989171;font-family:Yomogi,cursive;font-size:19px;transition:transform .15s ease,box-shadow .15s ease}.primary:hover,.primary:focus-visible{outline:0;transform:translate(-1px,-1px);box-shadow:5px 6px #989171}.primary:active{transform:translate(2px,3px);box-shadow:0 0 #989171}.complete{display:grid;grid-template-columns:minmax(230px,.9fr) 1.4fr;gap:clamp(25px,6vw,60px);align-items:center;border-color:#765d42;background:#eee0bd}.crate-wrap{position:relative;width:min(100%,310px);aspect-ratio:1.05;margin:auto;padding-top:37px}.crate{position:relative;display:grid;place-items:center;width:100%;height:calc(100% - 37px);border:12px solid #986b42;background:repeating-linear-gradient(90deg,#bd905e 0 20px,#af7e50 21px 23px);box-shadow:inset 0 0 0 3px #68482f,6px 7px #806046}.crate .part{width:83%;transform:rotate(-4deg)}.crate span{position:absolute;bottom:8px;right:9px;color:#4d3928;font-size:9px}.crate-lid{position:absolute;z-index:2;top:0;left:5%;width:90%;padding:9px;border:4px solid #885d3a;color:#f0dcb1;background:#ae7c4d;box-shadow:3px 3px #725039;font-family:Kaisei Decol,serif;font-size:11px;letter-spacing:.12em;line-height:1.35;text-align:center;transform:rotate(-2deg)}.complete-copy>p{margin:0;color:#886343;font-size:10px;letter-spacing:.1em}.complete-copy>h2{margin:8px 0}.complete-copy>span{color:#695b45;font-family:Yomogi,cursive;font-size:18px}.complete dl{display:grid;gap:8px;margin:22px 0 0}.complete dl div{display:flex;justify-content:space-between;gap:15px;padding-bottom:8px;border-bottom:1px dashed #ab9471}.complete dt{color:#857156;font-size:9px}.complete dd{margin:0;color:#5e513e;font-size:10px;text-align:right}.shelf{display:grid;grid-template-columns:1fr 105px auto;align-items:center;gap:12px;min-height:100px;margin:28px 0 0;padding:10px 14px;border-top:3px solid #6b7058;color:#64654d;background:#c4bea5;font-family:Yomogi,cursive;font-size:16px}.shelf .part{width:105px}.shelf b{color:#535946;font-family:DM Mono,monospace;font-size:10px}.shelf i{grid-column:1 / -1;color:#815f40;font-style:normal;font-size:14px}.motion{display:block;margin-top:26px;color:#72725d;font-size:10px;text-align:center}.motion input{accent-color:#68785d;vertical-align:-2px}footer{padding:31px 5px 0;color:#777764;font-family:Yomogi,cursive;font-size:14px;text-align:center}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@media(max-width:650px){main{padding:14px 10px 32px}header{padding:30px 0 17px}.factory{min-height:225px}.factory-part{left:3%;bottom:7px;width:110px}.factory-sign i{display:none}.choice-grid{grid-template-columns:1fr}.choice{min-height:86px}.ticket{align-items:flex-start;gap:5px;font-size:13px}.processing-detail,.complete{grid-template-columns:1fr}.processing-detail .part{width:170px}.complete{padding:26px 20px}.crate-wrap{width:235px}ol{grid-template-columns:1fr;gap:0}ol li{display:grid;grid-template-columns:45px 1fr;min-height:auto;padding:8px;border-top-width:1px}ol li span{margin:0}.shelf{grid-template-columns:1fr 80px}.shelf b{grid-column:1 / -1}.shelf .part{width:80px}.reject-stamp{right:15px}}