:root{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Noto Sans CJK SC,sans-serif;color:#28251f;background:#f4efe6;font-synthesis:none;--ink: #25231f;--paper: #fbf8f1;--red: #bd3d2f;--muted: #7a746a;--line: rgba(55, 47, 38, .14)}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100dvh;background:radial-gradient(circle at 80% 0,#fffaf0 0,transparent 36%),#f4efe6}button,input{font:inherit}button{-webkit-tap-highlight-color:transparent}.app{width:min(100%,720px);min-height:100dvh;margin:auto;padding-bottom:calc(24px + env(safe-area-inset-bottom))}.topbar{position:sticky;z-index:20;top:0;padding:calc(12px + env(safe-area-inset-top)) 16px 12px;background:#f4efe6ed;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}.brandrow{display:flex;align-items:center;justify-content:space-between;margin-bottom:11px}.brand{display:flex;align-items:baseline;gap:8px;font-family:STKaiti,KaiTi,serif;font-size:22px;font-weight:700;letter-spacing:.08em}.brand small{color:var(--muted);font:11px/1 sans-serif;letter-spacing:.08em}.role-switch{display:grid;grid-template-columns:1fr 1fr;padding:3px;border-radius:12px;background:#e9e1d4}.role-switch button{min-height:38px;border:0;border-radius:9px;color:#675f55;background:transparent;font-weight:650}.role-switch button.active{color:#fff;background:var(--ink);box-shadow:0 2px 8px #40372e33}.content{padding:20px 16px}.eyebrow{color:var(--red);font-size:12px;font-weight:750;letter-spacing:.12em}h1{margin:8px 0 6px;font:700 28px/1.25 STKaiti,KaiTi,serif}.sub{margin:0 0 20px;color:var(--muted);font-size:14px;line-height:1.55}.upload{display:block;overflow:hidden;position:relative;min-height:260px;border:1.5px dashed #aaa194;border-radius:18px;background:#ffffff75;cursor:pointer}.upload input{position:absolute;width:1px;height:1px;opacity:0}.upload-empty{display:grid;place-content:center;height:260px;padding:28px;text-align:center}.upload-icon{width:48px;height:48px;margin:0 auto 13px;display:grid;place-items:center;border-radius:50%;color:#fff;background:var(--red);font-size:27px}.upload-empty strong{font-size:17px}.upload-empty span{margin-top:8px;color:var(--muted);font-size:13px}.upload-preview{display:block;width:100%;height:360px;object-fit:contain;background:#ded8ce}.upload-change{position:absolute;right:12px;bottom:12px;padding:8px 12px;color:#fff;background:#211f1ccc;border-radius:99px;font-size:13px}.primary,.secondary,.danger{width:100%;min-height:50px;margin-top:14px;border:0;border-radius:14px;font-weight:750}.primary{color:#fff;background:var(--red);box-shadow:0 6px 18px #bd3d2f35}.primary:disabled{opacity:.45;box-shadow:none}.secondary{color:var(--ink);background:#e8e0d3}.danger{color:#fff;background:var(--ink)}.form-error{margin:10px 2px 0;padding:10px 12px;border:1px solid #d77c72;border-radius:10px;color:#8d2c24;background:#fff0ed;font-size:13px;line-height:1.45}.section-title{display:flex;align-items:center;justify-content:space-between;margin:28px 0 12px}.section-title h2{margin:0;font-size:17px}.count{color:var(--muted);font-size:12px}.empty{padding:34px 20px;border:1px solid var(--line);border-radius:16px;color:var(--muted);background:#fff6;text-align:center}.cards{display:grid;gap:12px}.card{display:grid;grid-template-columns:86px 1fr auto;align-items:center;gap:13px;min-height:104px;padding:9px;border:1px solid var(--line);border-radius:16px;background:var(--paper);box-shadow:0 4px 20px #5e50360b;cursor:pointer}.thumb{width:86px;height:86px;border-radius:11px;object-fit:cover;background:#ddd6ca}.card h3{overflow:hidden;margin:0 0 7px;font-size:15px;text-overflow:ellipsis;white-space:nowrap}.meta{color:var(--muted);font-size:12px}.badge{display:inline-block;margin-top:8px;padding:4px 8px;border-radius:99px;color:#8b611e;background:#f3e6c8;font-size:11px}.badge.done{color:#37694b;background:#deeee2}.chev{padding-right:4px;color:#948b7f;font-size:22px}.detail-head{display:flex;align-items:center;gap:10px;margin-bottom:12px}.back{width:40px;height:40px;border:0;border-radius:50%;background:#e7dfd2;font-size:22px}.detail-head h1{margin:0;font-size:22px}.viewer{position:relative;overflow:hidden;width:100%;height:min(61dvh,540px);min-height:360px;border-radius:18px;background:#25231f;box-shadow:0 12px 35px #2a241a24;touch-action:none}.scene{position:absolute;left:0;top:0;transform-origin:0 0;will-change:transform}.scene img{display:block;width:100%;height:100%;-webkit-user-select:none;user-select:none;-webkit-user-drag:none}.drawing{position:absolute;inset:0;overflow:visible}.hint{position:absolute;z-index:3;left:50%;top:12px;transform:translate(-50%);padding:7px 11px;border-radius:99px;color:#fff;background:#171512aa;font-size:11px;white-space:nowrap;pointer-events:none}.recording-dot{display:inline-block;width:8px;height:8px;margin-right:7px;border-radius:50%;background:#ef493a;animation:pulse 1.25s infinite}@keyframes pulse{50%{opacity:.35}}.toolbar{display:flex;gap:10px;margin-top:12px}.toolbar button{flex:1;min-height:48px;margin:0}.modebar{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-top:12px;padding:6px;border:1px solid var(--line);border-radius:15px;background:#e9e1d4}.modebar button{display:grid;place-items:center;gap:2px;min-height:50px;padding:5px 2px;border:0;border-radius:10px;color:#6e665c;background:transparent;font-size:11px}.modebar button b{font-size:18px;line-height:1}.modebar button.active{color:#fff;background:var(--ink)}.modebar button:disabled{opacity:.38}.brush-sizes{display:flex;align-items:center;justify-content:flex-end;gap:7px;margin:9px 2px 0}.brush-sizes[hidden]{display:none}.brush-sizes>span{margin-right:2px;color:var(--muted);font-size:12px}.brush-sizes button{min-width:44px;min-height:34px;border:1px solid var(--line);border-radius:9px;color:#665e54;background:var(--paper);font-size:12px}.brush-sizes button.active{border-color:var(--ink);color:#fff;background:var(--ink)}.pointer-dot{fill:#ed3e31;stroke:#fff;filter:drop-shadow(0 1px 3px #0008);pointer-events:none}.pointer-dot[hidden]{display:none}.status-line{min-height:22px;margin:12px 2px 0;color:var(--muted);font-size:13px;text-align:center}.replay-controls{display:grid;grid-template-columns:1fr auto;gap:10px}.replay-controls .primary{margin-top:12px}.round{width:50px;height:50px;margin-top:12px;border:0;border-radius:14px;color:var(--ink);background:#e8e0d3;font-size:22px}.replay-timeline{margin-top:13px}.replay-timeline input{display:block;width:100%;height:24px;margin:0;accent-color:var(--red);touch-action:none}.replay-timeline input::-webkit-slider-thumb{width:22px;height:22px}.replay-timeline>div{display:flex;justify-content:space-between;margin-top:1px;color:var(--muted);font-variant-numeric:tabular-nums;font-size:12px}.toast{position:fixed;z-index:99;left:50%;bottom:calc(24px + env(safe-area-inset-bottom));transform:translate(-50%,20px);padding:11px 16px;border-radius:12px;color:#fff;background:#25231fee;opacity:0;transition:.2s;pointer-events:none;white-space:nowrap}.toast.show{transform:translate(-50%);opacity:1}@media(min-width:721px){.app{border-inline:1px solid var(--line);background:#f4efe6}.content{padding-inline:24px}}