:root{color:#655e52;font-synthesis:none;--green:#7ba68e;--cream:#f8f4ec;background:#f8f4ec;font-family:Malgun Gothic,Apple SD Gothic Neo,sans-serif;font-weight:400;line-height:1.55}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{overscroll-behavior:none;width:100%;height:100%;margin:0;overflow:hidden}body{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}button,input{font:inherit}button{cursor:pointer;touch-action:manipulation;color:inherit;border:0;min-width:80px;min-height:80px}button:focus-visible,input:focus-visible{outline-offset:4px;outline:3px solid #7b9dc7}button:disabled{opacity:.35;cursor:default}button:active:not(:disabled){transform:translateY(2px)}button svg{width:40px;height:40px;margin:auto;display:block}.app-shell{touch-action:none;grid-template-rows:112px minmax(0,1fr);gap:0;height:100dvh;padding:0 24px 24px;display:grid}.toolbar{justify-content:space-between;align-items:center;gap:20px;padding:0 8px;display:flex}.brand-mark{flex-direction:column;flex-shrink:0;align-items:center;gap:6px;width:90px;display:flex}.brand-mark>svg{width:52px;height:52px}.journey-dots{gap:7px;display:flex}.journey-dots i{background:#d6d1c6;border-radius:50%;width:5px;height:5px}.journey-dots i.active{background:#83aa93;border-radius:5px;width:16px}.pencil-tray{gap:10px;padding:0 4px;display:flex}.pencil-button{background:0 0;border:2px solid #0000;border-radius:24px;width:80px;height:80px;transition:background .2s,transform .2s}.pencil-button svg{width:50px;height:60px;transition:transform .2s;transform:rotate(-8deg)}.pencil-button:nth-child(2n) svg{transform:rotate(7deg)}.pencil-button.selected{background:#fff;border-color:#eee8dc;box-shadow:0 4px #e8e0d0}.pencil-button.selected svg{transform:translateY(-5px)rotate(0)}.tools{gap:12px;display:flex}.icon-button{color:#928878;background:#eee9df;border-radius:25px;flex-shrink:0;place-items:center;width:80px;height:80px;display:grid}.sound-button{color:#7d9d8a;background:#e3ece6}.lock-button{color:#b4aa9a;background:0 0;position:relative}.lock-button svg{width:30px;height:30px}.lock-button.holding:after{content:"";border:4px solid #a0b99e;border-radius:25px;animation:3s linear forwards hold-ring;position:absolute;inset:5px}.drawing-paper{isolation:isolate;background-color:#fffdfa;background-image:radial-gradient(#e4ded038 .9px,#0000 .9px);background-size:24px 24px;border-radius:38px;min-height:70dvh;position:relative;overflow:hidden;box-shadow:0 4px #e7e0d3,0 16px 40px #b4a78c09}.trace-canvas{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;width:100%;height:100%;display:block}.paper-corner{opacity:.48;pointer-events:none;z-index:1;background:repeating-linear-gradient(45deg,#e6dfd0,#e6dfd0 5px,#f4eddf 5px 10px);width:70px;height:22px;position:absolute;top:16px}.corner-left{left:20px;transform:rotate(-18deg)}.corner-right{right:20px;transform:rotate(18deg)}.drawing-paper.celebrating{animation:1.8s ease-out paper-glow}.start-overlay{background:#fffdfaf5;flex-direction:column;justify-content:center;align-items:center;gap:25px;display:flex;position:absolute;inset:0}.start-rainbow svg{width:145px;height:145px;transform:rotate(-5deg)}.start-button{color:#fff;background:#82ac92;border-radius:50%;width:145px;height:145px;box-shadow:0 10px #6e967c,0 20px 35px #9fbbaa30}.start-button svg{width:65px;height:65px;margin-left:44px}.start-spark{pointer-events:none;background:#e7ca7e;border-radius:7px;width:18px;height:18px;position:absolute;transform:rotate(30deg)}.spark-one{top:32%;left:33%}.spark-two{background:#dca1a7;width:12px;height:12px;bottom:27%;right:32%}.modal-scrim{z-index:10;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);touch-action:none;background:#6d655a4d;place-items:center;padding:24px;display:grid;position:fixed;inset:0}.parent-panel{background:#fbf9f4;border-radius:32px;flex-direction:column;width:min(1200px,100%);height:min(860px,100%);display:flex;overflow:hidden;box-shadow:0 25px 100px #44382622}.parent-header{border-bottom:1px solid #e8e1d6;justify-content:space-between;align-items:center;gap:20px;padding:26px 34px 20px;display:flex}.eyebrow{letter-spacing:.12em;color:#899c83;font-size:12px;font-weight:700}h1,h2,p{margin:0}h1{letter-spacing:-.06em;margin-top:5px;font-size:27px;line-height:1.5}h2{letter-spacing:-.04em;margin-bottom:12px;font-size:19px}.parent-scroll{overscroll-behavior:contain;touch-action:pan-y;padding:26px 34px 34px;overflow:auto}.parent-columns{grid-template-columns:1.7fr 1fr;gap:30px;display:grid}.muted{color:#938a7d;margin-bottom:26px;font-size:14px;line-height:1.8}.recording-row{background:#fff;border:1px solid #ede7dc;border-radius:22px;margin-top:14px;padding:20px;transition:background .2s}.recording-label{align-items:center;gap:12px;display:flex}.slot-number{color:#a6987d;background:#f0eadf;border-radius:50%;flex-shrink:0;place-items:center;width:36px;height:36px;font-size:15px;display:grid}.recording-label strong{font-size:15px;display:block}.recording-label small{color:#a49a8b;margin-top:3px;font-size:12px;display:block}.recording-actions{justify-content:flex-end;gap:12px;margin-top:14px;display:flex}.recording-actions button{background:#f5f1e9;border-radius:17px;flex-direction:column;justify-content:center;align-items:center;gap:2px;padding:8px;display:flex}.recording-actions button:first-child{color:#6d9980;background:#eaf1e9}.recording-actions svg{width:25px;height:25px;margin:0}.recording-actions span{font-size:11px}.is-recording{background:#eff5eb;border-color:#aac4a2}.is-recording .slot-number{color:#fff;background:#a7c6a2;animation:1s infinite record-pulse}.parent-aside{flex-direction:column;gap:16px;display:flex}.info-card{background:#f1ede3;border-radius:22px;padding:24px}.info-card h2{font-size:15px}.info-card p{font-size:13px;line-height:1.9}.info-card small{color:#9a8e7d;margin-top:10px;font-size:11px;line-height:1.8;display:block}.time-stat{letter-spacing:-.05em;color:#7d967c;margin:14px 0;font-size:42px;line-height:1.3}.time-stat span{color:#9c9988;margin:0 4px;font-size:14px}.toggle-row{justify-content:space-between;align-items:center;gap:20px;display:flex}.toggle-row strong{font-size:15px}.toggle-row small{margin-top:4px}.toggle-row input{accent-color:#7ba68e;flex-shrink:0;width:46px;height:28px}.local-note{color:#a59885;margin:20px 0 0;font-size:11px;line-height:1.8}.notice{color:#78886d;background:#edf1e7;border-radius:16px;margin-bottom:20px;padding:16px 20px;font-size:13px}.gate-panel{touch-action:pan-y;text-align:center;background:#fbf9f3;border-radius:32px;width:420px;max-height:100%;padding:32px;position:relative;overflow:auto}.gate-panel>svg{color:#a79d8c;width:34px;height:34px}.gate-panel h1{margin:10px 0;font-size:23px}.gate-panel p{color:#9b8e7b;font-size:14px}.modal-close{background:0 0;position:absolute;top:4px;right:4px}.modal-close svg{width:25px;height:25px}.gate-progress{justify-content:center;gap:10px;margin:20px 0;display:flex}.gate-progress i{background:#ddd5c6;border-radius:50%;width:8px;height:8px}.gate-progress i.filled{background:#8ead8c}.number-pad{grid-template-columns:repeat(3,1fr);gap:10px;display:grid}.number-pad button{color:#8d7d65;background:#f0ebdf;border-radius:20px;font-size:27px}@keyframes paper-glow{0%{box-shadow:inset 0 0 0 6px #e8c9da,0 4px #e7e0d3}45%{box-shadow:inset 0 0 0 6px #c6dec6,0 4px #e7e0d3}to{box-shadow:inset 0 0 #f4dfb400,0 4px #e7e0d3}}@keyframes hold-ring{0%{clip-path:inset(100% 0 0)}to{clip-path:inset(0)}}@keyframes record-pulse{50%{opacity:.45}}@media (width<=1000px){.app-shell{grid-template-rows:104px minmax(0,1fr);padding:0 16px 16px}.toolbar{gap:8px;padding:0}.brand-mark{width:48px}.brand-mark>svg{width:40px;height:40px}.pencil-tray,.tools{gap:4px}.parent-header{padding:16px 24px}.parent-scroll{padding:22px}.parent-columns{grid-template-columns:1.6fr 1fr;gap:20px}.recording-row{padding:14px}.recording-actions{gap:6px}.recording-actions button{min-width:80px}.info-card{padding:18px}.time-stat{font-size:34px}h1{font-size:24px}}@media (width<=720px){.brand-mark{display:none}.toolbar{justify-content:center;gap:4px}.pencil-tray{gap:0;padding:0}.tools{gap:0}.icon-button,.pencil-button{border-radius:20px}.app-shell{padding:0 6px 6px}.parent-columns{grid-template-columns:1fr}.parent-header h1{font-size:20px}.modal-scrim{padding:10px}.parent-scroll{padding:18px}.drawing-paper{border-radius:25px}.start-rainbow svg{width:100px;height:100px}.start-button{width:120px;height:120px}.start-button svg{margin-left:32px}}.voice-pack-card>button{color:#617f68;background:#e3ece1;border-radius:18px;margin:14px 8px 0 0;padding:12px 18px;font-size:14px}.voice-pack-card>button+button{color:#8a7c68;background:#faf8f1}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}