@import "https://fonts.googleapis.com/css2?family=Cute+Font&family=Dongle:wght@400;700&family=Jua&family=Nanum+Pen+Script&family=Noto+Sans+KR:wght@400;600;700;800&display=swap";*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{color:#4a2540;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;--pink-bg:#ffe4ef;--pink-bg-soft:#fff0f6;--pink-bg-card:#fff;--pink-border:#f3b8d0;--pink-border-strong:#e894b8;--text-primary:#4a2540;--text-secondary:#6d3a58;--text-muted:#9a6080;--accent:#d6386e;--accent-hover:#c42d62;--accent-soft:#f472a8;--accent-gradient:linear-gradient(135deg, #f472a8, #d6386e);--board-surface:#fff8fb;--shadow-soft:0 4px 20px #b4467826;--shadow-card:0 2px 12px #b446781f;--font-display:"Jua", "Noto Sans KR", sans-serif;--font-cute:"Dongle", "Cute Font", "Jua", sans-serif;--font-hand:"Nanum Pen Script", "Jua", cursive;background:#ffe4ef;font-family:Noto Sans KR,system-ui,sans-serif;font-weight:400;line-height:1.5}body{background:radial-gradient(ellipse 90% 70% at 50% 0%, #fff5f9 0%, transparent 65%), radial-gradient(ellipse 70% 50% at 90% 100%, #ffd6e8 0%, transparent 55%), radial-gradient(ellipse 60% 40% at 10% 80%, #ffe0ec 0%, transparent 50%), var(--pink-bg);min-height:100vh}#root{min-height:100vh}button{cursor:pointer;border:none;font-family:inherit}input{font-family:inherit}.home{justify-content:center;align-items:center;min-height:100vh;padding:2rem 1.25rem;transition:align-items .4s;display:flex}.home-card{background:var(--pink-bg-card);border:2px solid var(--pink-border);width:min(520px,100%);height:min(600px,100vh - 4rem);box-shadow:var(--shadow-soft);text-align:center;box-sizing:border-box;border-radius:28px;flex-direction:column;padding:1.5rem 1.5rem 1.75rem;display:flex;position:relative;overflow:hidden}.home-card:before{content:"";pointer-events:none;background:radial-gradient(circle at 20% 15%,#f472a81f,#0000 40%),radial-gradient(circle at 85% 80%,#d6386e14,#0000 45%);position:absolute;inset:0}.home-card>*{z-index:1;position:relative}.title-banner{flex-shrink:0;justify-content:center;align-items:center;width:100%;margin-bottom:.75rem;display:flex}.title-banner-image{object-fit:contain;-webkit-user-select:none;user-select:none;pointer-events:none;filter:drop-shadow(0 4px 12px #b446782e);width:100%;max-width:420px;height:auto;max-height:140px;display:block}.home-intro{opacity:1;flex-direction:column;flex:1;justify-content:center;align-items:center;transition:opacity .35s;display:flex;overflow:hidden}.home-intro--hidden{opacity:0;pointer-events:none;flex:0;max-height:0;margin:0;padding:0}.subtitle{color:var(--text-secondary);background:var(--pink-bg-soft);border:1.5px solid var(--pink-border);border-radius:999px;margin-bottom:1.5rem;padding:.35rem 1rem;font-size:.95rem;font-weight:700;display:inline-block}.desc{color:var(--text-muted);margin-bottom:1.75rem;font-size:.95rem;line-height:1.6}.start-btn{color:#fff;background:var(--accent-gradient);border-radius:999px;justify-content:center;align-items:center;gap:.4rem;min-width:200px;padding:.9rem 1.75rem;font-size:1.1rem;font-weight:800;transition:transform .15s,box-shadow .15s,filter .15s;display:inline-flex;box-shadow:0 6px 18px #d6386e59}.start-btn:hover{filter:brightness(1.03);transform:translateY(-2px);box-shadow:0 8px 22px #d6386e6b}.start-btn:active{transform:translateY(0);box-shadow:0 4px 12px #d6386e4d}.foot-note{color:var(--text-muted);margin-top:1.25rem;font-size:.75rem}.survey{flex-direction:column;flex:1;align-items:center;padding:.25rem .25rem .5rem;animation:.45s both survey-fade-in;display:flex}@keyframes survey-fade-in{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.survey-progress{color:var(--text-muted);background:var(--pink-bg-soft);border:1.5px solid var(--pink-border);border-radius:999px;margin-bottom:1.5rem;padding:.3rem .9rem;font-size:.85rem;font-weight:700}.survey-question{font-family:var(--font-cute);color:var(--text-primary);letter-spacing:.01em;max-width:18em;margin:auto 0;padding:.5rem .75rem 1.5rem;font-size:clamp(1.55rem,5vw,2rem);font-weight:700;line-height:1.35}.ox-row{justify-content:center;align-items:stretch;gap:1.5rem;width:100%;margin-top:auto;padding:.5rem 0 .85rem;display:flex}.ox-btn{cursor:pointer;isolation:isolate;-webkit-tap-highlight-color:transparent;background:#fff;border:2px solid #ead0dc;border-radius:18px;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:.55rem;max-width:168px;min-height:148px;padding:1.1rem .85rem .85rem;transition:transform .15s,border-color .15s,box-shadow .15s,background .15s;display:inline-flex;position:relative;box-shadow:0 2px #b446780f}.ox-btn__glyph{font-family:var(--font-display);letter-spacing:.02em;-webkit-user-select:none;user-select:none;box-shadow:none;background:0 0;border:none;border-radius:0;justify-content:center;align-items:center;width:auto;height:auto;font-size:4.6rem;font-weight:800;line-height:1;transition:transform .12s;display:flex}.ox-btn__caption{letter-spacing:.02em;color:var(--text-muted);font-family:Noto Sans KR,sans-serif;font-size:.88rem;font-weight:700;position:static;bottom:auto;left:auto;transform:none}.ox-btn--o{background:linear-gradient(#fff 0%,#f3fcf6 100%);border-color:#b7ebc8}.ox-btn--o .ox-btn__glyph{color:#22c55e;box-shadow:none;-webkit-text-fill-color:#22c55e;text-shadow:0 1px #bbf7d0,0 2px #86efac,0 3px #4ade80,0 4px #16a34a,0 6px #166534,0 8px 14px #16653459;background:0 0;border:none}.ox-btn--o .ox-btn__caption{color:#15803d}.ox-btn--o:hover{background:#f0fdf4;border-color:#86efac;transform:translateY(-2px);box-shadow:0 4px 14px #22c55e29}.ox-btn--o:active{box-shadow:none;transform:translateY(1px)}.ox-btn--o:active .ox-btn__glyph{text-shadow:0 1px #bbf7d0,0 2px #4ade80,0 3px #166534,0 4px 8px #16653447;transform:translateY(3px)}.ox-btn--x{background:linear-gradient(#fff 0%,#fff5f7 100%);border-color:#f9c2cc}.ox-btn--x .ox-btn__glyph{color:#f43f5e;box-shadow:none;-webkit-text-fill-color:#f43f5e;text-shadow:0 1px #fecdd3,0 2px #fda4af,0 3px #fb7185,0 4px #e11d48,0 6px #9f1239,0 8px 14px #9f123959;background:0 0;border:none}.ox-btn--x .ox-btn__caption{color:#be123c}.ox-btn--x:hover{background:#fff1f2;border-color:#fb7185;transform:translateY(-2px);box-shadow:0 4px 14px #f43f5e24}.ox-btn--x:active{box-shadow:none;transform:translateY(1px)}.ox-btn--x:active .ox-btn__glyph{text-shadow:0 1px #fecdd3,0 2px #fb7185,0 3px #9f1239,0 4px 8px #9f123947;transform:translateY(3px)}.survey-done{font-family:var(--font-display);color:var(--text-primary);margin:auto 0;font-size:1.35rem;line-height:1.6}.survey-done-sub{color:var(--text-muted);margin-top:.5rem;font-family:Noto Sans KR,sans-serif;font-size:.9rem;font-weight:600;display:inline-block}@media (width<=420px){.ox-row{gap:.85rem}.ox-btn{border-radius:16px;max-width:none;min-height:132px;padding:.9rem .6rem .7rem}.ox-btn__glyph{font-size:3.8rem}.ox-btn__caption{font-size:.78rem}}.result{flex-direction:column;flex:1;justify-content:center;align-items:center;gap:.65rem;width:100%;min-height:0;animation:.45s both survey-fade-in;display:flex;overflow:auto}.result-score{color:var(--text-secondary);background:var(--pink-bg-soft);border:1.5px solid var(--pink-border);border-radius:999px;flex-shrink:0;padding:.35rem 1rem;font-size:.9rem;font-weight:800}.result-image{width:100%;height:auto;max-height:min(380px,55vh);box-shadow:var(--shadow-soft);border:2px solid var(--pink-border);object-fit:contain;background:#fff;border-radius:18px;display:block}.result-retry{flex-shrink:0;min-width:180px;margin-top:.15rem;padding:.7rem 1.4rem;font-size:1rem}.name-form{flex-direction:column;flex:1;justify-content:center;align-items:center;gap:.65rem;min-height:0;padding:.25rem .75rem .5rem;animation:.35s both survey-fade-in;display:flex}.name-form-prompt{font-family:var(--font-display);color:var(--text-primary);font-size:clamp(1.15rem,4vw,1.45rem);line-height:1.45}.name-form-hint{color:var(--text-muted);margin-bottom:.5rem;font-size:.85rem;font-weight:600}.name-form-label{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.name-form-input{text-align:center;width:min(280px,90%);color:var(--text-primary);background:var(--pink-bg-soft);border:2px solid var(--pink-border);box-shadow:var(--shadow-card);border-radius:18px;outline:none;padding:.85rem 1.1rem;font-size:1.15rem;font-weight:700;transition:border-color .15s,box-shadow .15s}.name-form-input::placeholder{color:#c48aa8;font-size:.95rem;font-weight:600}.name-form-input:focus{border-color:var(--pink-border-strong);box-shadow:0 0 0 3px #f472a838}.name-form-next{margin-top:.75rem}.name-form-next:disabled{opacity:.45;cursor:not-allowed;filter:none;transform:none;box-shadow:0 4px 12px #d6386e33}.name-form-next:disabled:hover{filter:none;transform:none;box-shadow:0 4px 12px #d6386e33}.result-image-wrap{flex:1;justify-content:center;align-items:center;width:100%;max-width:100%;min-height:0;display:flex;position:relative}.result-image-wrap .result-image{object-fit:contain;width:100%;max-width:100%;max-height:100%}.result-patient-name{box-sizing:border-box;font-family:var(--font-hand);color:#3a2a28;letter-spacing:.04em;white-space:nowrap;text-align:center;pointer-events:none;-webkit-user-select:none;user-select:none;text-shadow:none;z-index:2;text-overflow:ellipsis;transform-origin:50%;justify-content:center;align-items:center;font-weight:400;line-height:1;display:flex;position:absolute;overflow:hidden}