:root{--bg: #fff6e9;--bg-2: #dcefeb;--card: #fffdf8;--ink: #3d3b54;--muted: #7a7890;--line: #ece3d6;--accent: #5e8c74;--accent-ink: #ffffff;--accent-soft: #e6f4ea;--mark: #ffe08a;--radius: 18px;color-scheme:light}*{box-sizing:border-box}html,body{margin:0}html{height:100%;background-color:var(--bg-2)}body{min-height:100%;font-family:Gowun Dodum,Noto Sans KR,system-ui,sans-serif;color:var(--ink);background:var(--bg-2) linear-gradient(180deg,var(--bg) 0%,var(--bg-2) 100%) no-repeat;-webkit-font-smoothing:antialiased}#app{min-height:100%}.page{min-height:100vh;display:grid;place-items:center;padding:32px 16px}.card{width:min(640px,100%);background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:32px clamp(20px,5vw,40px);box-shadow:0 20px 50px -30px #283c3259;animation:rise .4s ease both}.card.small{width:min(460px,100%);text-align:center}@keyframes rise{0%{opacity:0;transform:translateY(10px)}}h1{font-size:clamp(22px,4.5vw,28px);line-height:1.35;margin:8px 0 10px;word-break:keep-all}h2{font-size:20px;margin:28px 0 6px;word-break:keep-all}.card.small h2{margin-top:4px}.sub{color:var(--muted);line-height:1.65;margin:0 0 18px;word-break:keep-all}.stepper{display:flex;gap:14px;list-style:none;padding:0;margin:0 0 18px;font-size:14px;color:var(--muted);flex-wrap:wrap}.stepper li{display:flex;align-items:center;gap:6px}.stepper span{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;border:1px solid var(--line);font-size:12px}.stepper .on{color:var(--accent);font-weight:700}.stepper .on span,.stepper .done span{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}.field{position:relative}textarea,input[type=text]{width:100%;font:inherit;font-size:18px;color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px 16px;resize:vertical;outline:none;transition:border-color .15s,box-shadow .15s}textarea:focus,input[type=text]:focus{border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft)}.field textarea{padding-bottom:32px}.count{position:absolute;right:12px;bottom:10px;font-size:12px;color:var(--muted)}.actions{display:flex;justify-content:flex-end;gap:10px;margin-top:22px;flex-wrap:wrap}.actions:has(.ghost){justify-content:space-between}.actions.column{flex-direction:column;align-items:stretch}.btn{font:inherit;font-size:16px;padding:12px 20px;border-radius:999px;border:1px solid var(--line);background:#fff;color:var(--ink);cursor:pointer;transition:transform .12s,background .15s,opacity .15s}@media(hover:hover){.btn:hover:not(:disabled){transform:translateY(-1px)}}.btn:disabled{opacity:.45;cursor:not-allowed}.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}.btn.ghost{background:transparent;border-color:transparent;color:var(--muted)}.btn.big{font-size:18px;padding:14px 32px;box-shadow:0 10px 30px -10px #143c3299}@keyframes appear{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}.distance{position:relative;aspect-ratio:4 / 3.3;margin:2px 0 16px;border-radius:18px;overflow:hidden;background:#dcecf0}canvas{-webkit-tap-highlight-color:transparent;outline:none}.distance canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%!important;height:100%!important;display:block}.distance .cloud-text{position:absolute;z-index:1;margin:0;transform:translate(-50%,-50%);font-weight:700;line-height:1.4;color:var(--ink);text-align:center;word-break:keep-all;overflow-wrap:anywhere;pointer-events:none}.distance-caption{min-height:92px}.distance-caption h1{margin-bottom:6px}.distance-caption .line{margin:0 0 6px;font-size:17px;line-height:1.85;color:var(--ink);word-break:keep-all;overflow-wrap:anywhere}.caption-in{animation:appear .6s ease both}@media(prefers-reduced-motion:reduce){.caption-in{transition:none!important;animation:none!important}}mark{background:var(--mark);color:inherit;padding:0 2px;border-radius:4px;-webkit-box-decoration-break:clone;box-decoration-break:clone}.laya-status{margin:0 0 12px;padding:10px 14px;border-radius:12px;background:#faf7f0;border:1px solid var(--line);font-size:15px;line-height:1.6;word-break:keep-all}.laya-status.busy{color:var(--muted);animation:pulse 1.6s ease-in-out infinite}.laya-status.error{color:#a8552a;background:#fff4ec;border-color:#f3d3bf}@keyframes pulse{50%{opacity:.55}}.categories{display:grid;gap:8px}.category{display:grid;grid-template-columns:1fr auto;gap:4px 12px;align-items:center;text-align:left;font:inherit;color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 14px;cursor:pointer;transition:border-color .15s,background .15s}@media(hover:hover){.category:hover{border-color:var(--accent)}}.category.on{border-color:var(--accent);background:var(--accent-soft);box-shadow:0 0 0 1px var(--accent) inset}.cat-name{font-size:16px}.category.on .cat-name{color:var(--accent);font-weight:700}.cat-pct{font-variant-numeric:tabular-nums;color:var(--muted);font-size:15px}.category.on .cat-pct{color:var(--accent);font-weight:700}.cat-bar{grid-column:1 / -1;height:6px;border-radius:999px;background:#eee9df;overflow:hidden}.cat-bar span{display:block;height:100%;border-radius:inherit;background:var(--accent);transition:width .6s ease}.cat-desc{grid-column:1 / -1;color:var(--muted);font-size:13px;line-height:1.5;word-break:keep-all}.optional{display:inline-block;vertical-align:middle;margin-left:4px;padding:2px 8px;border-radius:999px;border:1px solid var(--line);color:var(--muted);font-size:12px;font-weight:400}.name-input{font-size:20px!important;padding:16px 18px!important}.name-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}.name-chips:empty{display:none}.chip{font:inherit;font-size:13px;padding:5px 11px;border-radius:999px;border:1px solid var(--line);background:#fff;color:var(--muted);cursor:pointer;transition:border-color .15s,color .15s}@media(hover:hover){.chip:hover{border-color:var(--accent);color:var(--accent)}}.chip.on{border-color:var(--accent);background:var(--accent-soft);color:var(--accent)}.reference{margin-top:22px;padding-top:16px;border-top:1px dashed var(--line)}.reference summary{cursor:pointer;color:var(--muted);font-size:15px;margin-bottom:10px}.reference .laya-status{font-size:14px}.reference .category{padding:10px 12px;background:#fcfbf8}.reference .cat-name{font-size:15px}.reference .cat-bar{height:4px}.reference .cat-bar span{background:#8fb5a9}.preview{margin:14px 0 0;padding:14px 16px;border-radius:12px;background:var(--accent-soft);color:var(--ink)}.methods{display:grid;gap:12px}.method{display:grid;grid-template-columns:56px 1fr;grid-template-rows:auto auto;column-gap:14px;align-items:center;text-align:left;font:inherit;color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px;cursor:pointer;transition:border-color .15s,transform .15s}@media(hover:hover){.method:hover{border-color:var(--accent);transform:translateY(-2px)}}.method .icon{grid-row:span 2;font-size:34px;display:grid;place-items:center;width:56px;height:56px;border-radius:14px;background:var(--accent-soft)}.method strong{font-size:17px}.method span:last-child{color:var(--muted);font-size:14px}.scene{position:fixed;top:0;right:0;bottom:0;left:0;overflow:hidden;background:#1e2230}.canvas-host{position:absolute;top:0;right:0;bottom:0;left:0}.canvas-host canvas{display:block;touch-action:none}.loading{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;color:#fff}.back{position:absolute;top:16px;left:16px;background:#ffffffd9!important;color:var(--ink)!important;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.insight{margin:0 0 12px;padding:10px 14px;border-radius:12px;background:var(--accent-soft);color:var(--ink);font-size:15px;line-height:1.6;word-break:keep-all}.back.mute{left:auto;right:16px;padding-left:14px;padding-right:14px;display:inline-flex;align-items:center;justify-content:center}.back.mute svg{width:20px;height:20px;height:1lh;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.hud{position:absolute;left:16px;right:16px;bottom:max(24px,env(safe-area-inset-bottom));display:flex;flex-direction:column;align-items:center;gap:14px;pointer-events:none;transition:opacity .6s,transform .6s}.hud>*{pointer-events:auto}.hud.gone{opacity:0;transform:translateY(12px)}.hud.gone>*{pointer-events:none}.hint{margin:0;max-width:520px;text-align:center;padding:10px 16px;border-radius:12px;background:#ffffffd9;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);line-height:1.6;word-break:keep-all}.finish{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;padding:16px;background:#141e1e40;animation:fade .8s ease both}@keyframes fade{0%{opacity:0}}.finish-icon{font-size:40px;margin:0}.scene .hint,.scene .back{background:#ffffff52!important;border:1px solid rgba(255,255,255,.65);backdrop-filter:blur(14px) saturate(1.2);-webkit-backdrop-filter:blur(14px) saturate(1.2);box-shadow:0 8px 24px -12px #3d3b5473}.scene[data-theme=leaf] .btn.primary{background:#3d3b54b8;border-color:#ffffff80;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.scene[data-theme=balloon] .btn.primary{background:#ffb4a2;border-color:#ffb4a2;color:var(--ink)}.stats-hero{margin:4px 0 14px;font-size:18px;line-height:1.6;color:var(--ink);word-break:keep-all}.stats-hero strong{font-size:26px;color:var(--accent)}.stat-list{list-style:none;margin:0 0 16px;padding:0;display:grid;gap:8px}.stat-list li{display:grid;grid-template-columns:28px 1fr auto;column-gap:8px;align-items:center;padding:10px 14px;border:1px solid var(--line);border-radius:12px;background:#faf7f0}.stat-icon{font-size:20px}.stat-name{font-size:15px;color:var(--ink)}.stat-count{font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums}.stats-note{margin:0;font-size:12px;color:var(--muted)}.feedback{margin-top:18px;padding-top:14px;border-top:1px dashed var(--line);text-align:center}.feedback summary{display:inline-block;cursor:pointer;font-size:14px;color:var(--muted);text-decoration:underline;text-underline-offset:3px;list-style:none}.feedback summary::-webkit-details-marker{display:none}.feedback[open] summary{margin-bottom:10px}.feedback textarea{font-size:15px;resize:none;text-align:left}.feedback .stats-note{margin-top:6px;text-align:left}.feedback-row{display:flex;align-items:center;justify-content:flex-end;gap:12px;margin-top:10px}.feedback-status{margin:0;flex:1;font-size:13px;color:var(--accent);text-align:left}