:root{--bg: #fff8fb;--bg-deep: #ffe8f0;--surface: #ffffff;--surface-soft: #fff0f5;--border: #f5c6d8;--text: #5c3d4a;--text-soft: #8a6575;--rose: #e8a4b8;--rose-deep: #d67b96;--blush: #ffd6e4;--leaf: #9bbf9b;--radius: 18px;--tap: 50px;font-family:Nunito,system-ui,sans-serif;line-height:1.5;color:var(--text);background:var(--bg)}*,*:before,*:after{box-sizing:border-box}body{margin:0;min-height:100dvh;background:radial-gradient(ellipse 100% 60% at 50% 0%,var(--blush) 0%,transparent 50%),radial-gradient(ellipse 80% 50% at 100% 100%,#ffe0ec 0%,transparent 45%),radial-gradient(ellipse 70% 40% at 0% 80%,#e8f5e9 0%,transparent 40%),var(--bg)}.floating-deco{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;overflow:hidden;z-index:0}.floating-deco span{position:absolute;font-size:clamp(1.75rem,6vw,2.5rem);opacity:.22;animation:drift 8s ease-in-out infinite}.floating-deco .f1{top:8%;left:6%;animation-delay:0s}.floating-deco .f2{top:22%;right:8%;animation-delay:-2.5s}.floating-deco .f3{bottom:18%;left:10%;animation-delay:-5s}.floating-deco .f4{bottom:28%;right:12%;font-size:clamp(1.25rem,4vw,1.75rem);animation-delay:-1s}@keyframes drift{0%,to{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-10px) rotate(4deg)}}#app{position:relative;z-index:1;max-width:520px;margin:0 auto;padding:max(1.25rem,env(safe-area-inset-top)) 1.25rem max(2rem,env(safe-area-inset-bottom))}.card{background:var(--surface);border:2px solid var(--border);border-radius:calc(var(--radius) + 6px);padding:1.35rem 1.15rem 1.5rem;box-shadow:0 4px 24px #d67b961f,0 1px #fffc inset}header{text-align:center;margin-bottom:1.35rem}.title-row{display:flex;align-items:center;justify-content:center;gap:.45rem;flex-wrap:wrap;margin-bottom:.5rem}.bow{font-size:1.35rem;line-height:1;filter:drop-shadow(0 1px 2px rgba(214,123,150,.35))}header h1{margin:0;font-size:clamp(1.35rem,4.5vw,1.65rem);font-weight:800;letter-spacing:-.02em;color:var(--rose-deep)}header p{margin:0 auto;max-width:34ch;font-size:.95rem;color:var(--text-soft);font-weight:600}.mode-row{display:flex;gap:.55rem;margin-bottom:1.1rem}.mode-row button{flex:1;min-height:var(--tap);border-radius:var(--radius);border:2px solid var(--border);background:var(--surface-soft);color:var(--text);font-size:.95rem;font-weight:800;cursor:pointer;transition:border-color .2s,background .2s,box-shadow .2s;font-family:inherit;line-height:1.2;padding:.35rem .5rem}.mode-row button:hover{border-color:var(--rose);background:#fff}.mode-row button[aria-pressed=true]{border-color:var(--rose-deep);background:linear-gradient(180deg,#fff 0%,var(--blush) 100%);box-shadow:0 2px 12px #d67b9633}.mode-hint{display:block;margin-top:.12rem;font-size:.82em;font-weight:700;opacity:.82}label{display:flex;align-items:center;gap:.35rem;font-size:.88rem;font-weight:800;color:var(--rose-deep);margin-bottom:.45rem}.label-icon{font-size:1rem}.field-heading{display:flex;align-items:center;gap:.35rem;font-size:.88rem;font-weight:800;color:var(--rose-deep);margin-bottom:.45rem}textarea,.output-box{width:100%;min-height:118px;padding:1rem;border-radius:var(--radius);border:2px solid var(--border);background:var(--surface-soft);color:var(--text);font-size:1.05rem;resize:vertical;font-family:inherit}textarea:focus{outline:3px solid rgba(232,164,184,.45);outline-offset:1px;background:#fff}.output-box{min-height:96px;white-space:pre-wrap;word-break:break-word;background:#fff}.field{margin-bottom:1.1rem}.actions{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.1rem}.actions button{min-height:var(--tap);padding:0 1.15rem;border-radius:var(--radius);border:none;font-size:.98rem;font-weight:800;cursor:pointer;font-family:inherit}.btn-primary{background:linear-gradient(165deg,var(--rose) 0%,var(--rose-deep) 100%);color:#fff;box-shadow:0 3px 14px #d67b9659}.btn-primary:active{transform:scale(.98)}.btn-secondary{background:var(--surface);color:var(--text);border:2px solid var(--border);font-weight:700}.toast{position:fixed;bottom:max(1.25rem,env(safe-area-inset-bottom));left:50%;transform:translate(-50%) translateY(120%);padding:.7rem 1.35rem;border-radius:999px;background:#fff;border:2px solid var(--leaf);color:#4a6b4a;font-weight:800;font-size:.9rem;opacity:0;pointer-events:none;transition:transform .28s ease,opacity .28s ease;z-index:20;box-shadow:0 4px 20px #00000014}.toast.show{transform:translate(-50%) translateY(0);opacity:1}@media (min-width: 480px){.card{padding:1.6rem 1.4rem 1.75rem}}