:root{color:#554b69;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:radial-gradient(circle at top,#ffe7f4bf,#0000 38%),radial-gradient(circle at 100%,#d6e6ffd9,#0000 28%),linear-gradient(#fff9fb 0%,#f6f4ff 46%,#f9fbff 100%);font-family:Pretendard,Inter,Noto Sans KR,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-weight:400;line-height:1.5}*{box-sizing:border-box}html{scroll-behavior:smooth}body{min-width:320px;min-height:100vh;margin:0}body:before{content:"";pointer-events:none;opacity:.6;background-image:radial-gradient(circle at 20% 20%,#ffffffe6 0 2px,#0000 3px),radial-gradient(circle at 80% 30%,#fffc 0 1.6px,#0000 3px),radial-gradient(circle at 40% 80%,#ffffffa6 0 2px,#0000 3px);position:fixed;inset:0}button,input,textarea{font:inherit}button{-webkit-tap-highlight-color:transparent}h1,h2,h3,p{margin:0}h1,h2,h3{color:#312847;letter-spacing:-.03em}h1{font-size:clamp(2.4rem,5vw,4.7rem);line-height:1.04}h2{font-size:clamp(1.35rem,3vw,1.9rem)}h3{font-size:1.08rem}p{line-height:1.7}#root{min-height:100vh}a{color:inherit}.app-shell{width:min(1180px,100% - 32px);margin:0 auto;padding:32px 0 56px}.hero-card,.panel{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1px solid #7867aa24;border-radius:30px;position:relative;overflow:hidden;box-shadow:0 20px 60px #5e48911f}.hero-card{background:linear-gradient(135deg,#fff5faf2,#f5f3ffeb);grid-template-columns:1.3fr .7fr;gap:24px;margin-bottom:24px;padding:40px;display:grid}.hero-copy h1{max-width:12ch;margin:10px 0 14px}.hero-copy p{max-width:62ch;font-size:1rem;line-height:1.75}.eyebrow,.panel-kicker,.prompt-badge,.helper-chip{letter-spacing:.02em;border-radius:999px;align-items:center;gap:8px;display:inline-flex}.eyebrow{color:#8c5db6;background:#ffffffb8;padding:8px 14px;font-weight:700}.hero-orbs{min-height:220px;position:relative}.orb{filter:blur(2px);opacity:.92;border-radius:999px;position:absolute}.orb-peach{background:radial-gradient(circle at 35% 30%,#fff9f3,#ffc8b4 62%,#ffac9e);width:190px;height:190px;inset:18px auto auto 12%}.orb-lilac{background:radial-gradient(circle at 35% 30%,#faf6ff,#d9bcff 65%,#c897ff);width:130px;height:130px;inset:74px 12% auto auto}.orb-mint{background:radial-gradient(circle at 35% 30%,#f6fff7,#b8f2d7 60%,#88dfc0);width:110px;height:110px;inset:auto 28% 12px auto}.grid-layout{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin-bottom:18px;display:grid}.panel{padding:28px}.soft-panel{background:linear-gradient(#f9f6fff2,#ffffffeb)}.cream-panel{background:linear-gradient(#fffbf5fa,#ffffffeb)}.result-panel{background:linear-gradient(#f3fbfff0,#fffffff0)}.panel-header{justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:18px;display:flex}.panel-header h2,.feedback-card h3{margin:6px 0 0}.panel-kicker{color:#8c5db6;background:#8c5db61f;padding:6px 11px;font-size:.76rem;font-weight:700}.ghost-button,.primary-button,.toggle-pill,.unit-card{cursor:pointer;border:none;transition:transform .2s,box-shadow .2s,background .2s}.ghost-button,.primary-button,.toggle-pill{font:inherit}.ghost-button,.primary-button{border-radius:16px;padding:12px 18px}.ghost-button{color:#6d5a8a;background:#ffffffc7;box-shadow:inset 0 0 0 1px #7a6caa1f}.primary-button{color:#fff;background:linear-gradient(135deg,#8f6dff,#ff8dbc);font-weight:700;box-shadow:0 12px 24px #9c6eff40}.ghost-button:hover,.primary-button:hover,.toggle-pill:hover,.unit-card:hover{transform:translateY(-1px)}.ghost-button:disabled,.primary-button:disabled{opacity:.6;cursor:wait;transform:none}.toggle-row{gap:10px;margin-bottom:16px;display:flex}.toggle-pill{color:#6a6281;background:#ffffffbd;border-radius:16px;flex:1;padding:14px 16px;box-shadow:inset 0 0 0 1px #7061961a}.toggle-pill.active,.unit-card.active{color:#4e3e77;background:linear-gradient(135deg,#906eff29,#ff8dbc2e);box-shadow:inset 0 0 0 1px #906eff47}.field-wrap{color:#5b5470;flex-direction:column;gap:10px;margin-top:8px;font-weight:600;display:flex}.field-wrap input,.field-wrap textarea{box-sizing:border-box;width:100%;font:inherit;color:#2f2742;resize:vertical;background:#ffffffd1;border:1px solid #826fb026;border-radius:18px;padding:16px 18px;box-shadow:inset 0 1px 2px #7262980d}.field-wrap input:focus,.field-wrap textarea:focus{border-color:#9372ff59;outline:2px solid #9372ff3d}.prompt-card,.topic-preview,.status-banner,.empty-state,.feedback-card{border-radius:22px}.prompt-card{background:#ffffffc7;margin-top:8px;padding:20px;box-shadow:inset 0 0 0 1px #826fb01a}.prompt-badge,.helper-chip{padding:7px 12px;font-size:.82rem;font-weight:700}.prompt-badge{color:#b35f80;background:#ffdce4a6;margin-bottom:10px}.helper-chip{color:#7b689c;background:#ffffffb3}.unit-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:18px;display:grid}.unit-card{text-align:left;background:#ffffffb8;border-radius:20px;padding:16px;box-shadow:inset 0 0 0 1px #826fb014}.unit-card strong{color:#453661;margin-bottom:8px;display:block}.unit-card span{color:#6d6581;line-height:1.55}.topic-preview{color:#5a4d77;background:#ffffffa3;flex-direction:column;gap:8px;margin-bottom:16px;padding:18px;display:flex}.topic-preview span{text-transform:uppercase;letter-spacing:.08em;opacity:.75;font-size:.82rem}.textarea-wrap{margin-top:0}.editor-footer{color:#7b7392;justify-content:space-between;align-items:center;gap:16px;margin-top:14px;display:flex}.status-banner{color:#9e4b67;background:#ffecf0f0;border:1px solid #cb7a982e;margin:0 0 18px;padding:15px 18px}.feedback-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;display:grid}.feedback-card{background:#ffffffd6;padding:20px;box-shadow:inset 0 0 0 1px #826fb017}.feedback-card.highlight{background:linear-gradient(#fff7fcf2,#ffffffe0)}.feedback-card.accent{background:linear-gradient(#f0fffaf2,#ffffffe0)}.feedback-card ul{color:#5d5571;margin:12px 0 0;padding-left:18px;line-height:1.75}.feedback-card p{color:#544d66;margin-top:12px;line-height:1.8}.empty-state{text-align:center;color:#5a5670;background:#ffffffa3;padding:30px 20px}.empty-state span{color:#847a9a;margin-top:10px;display:block}@media (width<=900px){.hero-card,.grid-layout,.feedback-grid,.unit-grid{grid-template-columns:1fr}.hero-card{padding:28px}.hero-copy h1{max-width:none}.hero-orbs{min-height:170px}}@media (width<=640px){.app-shell{width:min(100% - 20px,1180px);padding-top:18px}.panel,.hero-card{border-radius:24px;padding:22px}.panel-header,.editor-footer,.toggle-row{flex-direction:column;align-items:stretch}.ghost-button,.primary-button{width:100%}}
