@import "https://fonts.googleapis.com/css2?family=Zen+Maru+Gothic:wght@400;500;700;900&family=M+PLUS+Rounded+1c:wght@400;500;700;800&display=swap";:root{--pink-50:#fff6f9;--pink-100:#ffeaf2;--pink-200:#ffd6e6;--pink-300:#ffbdd6;--pink-400:#ff9ec3;--pink-500:#ff7fb0;--pink-600:#f5619b;--text:#7a5566;--text-strong:#e8558f;--white:#fff;--shadow-soft:0 10px 24px #ff8cb42e;--shadow-pop:0 14px 30px #ff78aa47;--rounded:"Zen Maru Gothic", "M PLUS Rounded 1c", "Hiragino Maru Gothic ProN", "ヒラギノ丸ゴ ProN W4", system-ui, sans-serif;font-family:var(--rounded);color:var(--text);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:17px;line-height:1.6}*{box-sizing:border-box}html,body{min-height:100%;margin:0;padding:0}body{background:var(--pink-50)}#root{min-height:100svh}h1,h2,h3,p{margin:0}button,input,textarea{font-family:inherit}.page{background:radial-gradient(60% 45% at 15% 10%,#fff 0%,#fff0 60%),radial-gradient(50% 40% at 85% 5%,#fff 0%,#fff0 55%),linear-gradient(170deg,#fff2f7 0%,#ffe6f0 45%,#ffdcea 100%);min-height:100svh;position:relative;overflow:hidden}.page:after{content:"";opacity:.75;pointer-events:none;background:linear-gradient(#ffc9dd 0%,#ffb7d2 100%);border-radius:50% 50% 0 0;height:260px;position:absolute;bottom:-140px;left:-10%;right:-10%}.deco{pointer-events:none;position:absolute;inset:0;overflow:hidden}.deco span{opacity:.7;filter:drop-shadow(0 4px 6px #ff96be59);font-size:28px;animation:6s ease-in-out infinite float;position:absolute}@keyframes float{0%,to{transform:translateY(0)rotate(-4deg)}50%{transform:translateY(-14px)rotate(6deg)}}.bubble-art{pointer-events:none;width:100%;height:100%;position:absolute;inset:0;overflow:visible}.bubble-art .art-line *{fill:#fff;stroke:var(--pink-200);stroke-width:3.5px;vector-effect:non-scaling-stroke}.bubble-art .art-fill *{fill:#fff}.bubble{break-inside:avoid;width:fit-content;max-width:100%;color:var(--text-strong);letter-spacing:.02em;word-break:break-word;white-space:pre-wrap;filter:drop-shadow(0 10px 18px #ff8cb438);margin:0 0 34px;font-size:20px;font-weight:700;line-height:1.65;animation:.5s cubic-bezier(.34,1.56,.64,1) both pop-in;position:relative}.bubble-body{z-index:1;position:relative}.bubble--round .bubble-body{min-height:74px;padding:26px 30px 28px}.bubble--cloud .bubble-body,.bubble--flower .bubble-body,.bubble--heart .bubble-body{text-align:center;flex-direction:column;justify-content:center;display:flex}.bubble--cloud .bubble-body{min-height:104px;padding:34px 46px 36px}.bubble--flower .bubble-body{min-height:116px;padding:40px 60px 42px}.bubble--heart .bubble-body{min-height:128px;padding:30px 48px 62px}.bubble:before,.bubble:after{content:"";z-index:1;border:3.5px solid var(--pink-200);background:#fff;border-radius:50%;position:absolute}.bubble:before{width:18px;height:18px;bottom:-10px;left:14%}.bubble:after{width:9px;height:9px;bottom:-26px;left:9%}.bubble--heart:before,.bubble--heart:after{display:none}.bubble:nth-child(3n){transform:rotate(-1.5deg)}.bubble:nth-child(3n+1){transform:rotate(1.2deg)}.bubble-mark{color:var(--pink-400);margin-top:8px;font-size:17px;display:block}@keyframes pop-in{0%{opacity:0;transform:scale(.8)translateY(18px)}to{opacity:1}}.screen{padding:36px 32px 80px}.screen-header{z-index:2;text-align:center;margin-bottom:34px;position:relative}.logo-badge{border:2px solid var(--pink-200);color:var(--pink-600);letter-spacing:.08em;box-shadow:var(--shadow-soft);background:#ffffffd9;border-radius:999px;align-items:center;gap:10px;padding:7px 20px;font-size:15px;font-weight:700;display:inline-flex}.screen-title{font-family:var(--rounded);letter-spacing:.04em;background:linear-gradient(#ff8fc0 0%,#f5518f 100%);color:#0000;-webkit-text-stroke:6px #fff;paint-order:stroke fill;filter:drop-shadow(0 6px #ffafcd8c);-webkit-background-clip:text;background-clip:text;margin:16px 0 12px;font-size:clamp(44px,7vw,96px);font-weight:900;line-height:1.05}.screen-sub{color:#fff;letter-spacing:.04em;box-shadow:var(--shadow-pop);background:linear-gradient(#ff9cc5 0%,#f96faa 100%);border-radius:999px;padding:8px 26px;font-size:17px;font-weight:700;display:inline-block}.bubble-field{z-index:1;columns:4;column-gap:26px;max-width:1500px;margin:0 auto;position:relative}@media (width<=1200px){.bubble-field{columns:3}}@media (width<=860px){.bubble-field{columns:2;column-gap:16px}}@media (width<=540px){.bubble-field{columns:1}.screen{padding:24px 18px 70px}}.empty{z-index:1;text-align:center;color:var(--pink-500);margin-top:60px;font-size:22px;font-weight:700;position:relative}.empty .big{margin-bottom:12px;font-size:48px;animation:4s ease-in-out infinite float;display:block}.counter-pill{z-index:3;border:2px solid var(--pink-200);color:var(--pink-600);box-shadow:var(--shadow-soft);background:#ffffffe6;border-radius:999px;padding:10px 22px;font-weight:700;position:fixed;bottom:24px;right:24px}.post{flex-direction:column;justify-content:center;align-items:center;padding:40px 20px 60px;display:flex}.post-inner{z-index:2;text-align:center;width:100%;max-width:460px;position:relative}.post-title{letter-spacing:.04em;background:linear-gradient(#ff8fc0 0%,#f5518f 100%);color:#0000;-webkit-text-stroke:5px #fff;paint-order:stroke fill;filter:drop-shadow(0 5px #ffafcd80);-webkit-background-clip:text;background-clip:text;font-size:clamp(30px,9vw,44px);font-weight:900;line-height:1.15}.post-lead{color:var(--pink-600);margin-top:12px;font-size:15px;font-weight:700}.post-card{border:3px solid var(--pink-200);box-shadow:var(--shadow-pop);text-align:left;background:#fff;border-radius:32px;margin-top:26px;padding:24px 22px}.field-label{color:var(--pink-600);margin-bottom:10px;font-size:15px;font-weight:700;display:block}.shape-picker{margin-bottom:22px}.picker-head{justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:6px;display:flex}.picker-head .field-label{margin-bottom:0}.picker-hint{color:var(--pink-400);white-space:nowrap;font-size:12px;font-weight:700}.shape-track{scroll-snap-type:x mandatory;padding:10px 0 16px;scrollbar-width:none;cursor:grab;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;gap:12px;margin-inline:-22px;padding-inline:calc(50% - 70px);display:flex;overflow-x:auto}.shape-track::-webkit-scrollbar{display:none}.shape-track.dragging{cursor:grabbing;scroll-snap-type:none}.shape-card{scroll-snap-align:center;cursor:pointer;opacity:.5;-webkit-tap-highlight-color:transparent;background:0 0;border:none;flex-direction:column;flex:0 0 140px;align-items:center;gap:10px;padding:0;transition:opacity .25s,transform .25s;display:flex;transform:scale(.88)}.shape-card.is-active{opacity:1;transform:scale(1)}.shape-card-name{color:var(--pink-600);font-size:13px;font-weight:700}.shape-card.is-active .shape-card-name:before{content:"♡ "}.bubble.bubble-mini{-webkit-user-select:none;user-select:none;width:132px;height:90px;margin:0;font-size:12px;line-height:1.35;animation:none;transform:none}.bubble.bubble-mini .bubble-body{text-align:center;flex-direction:column;justify-content:center;align-items:center;height:100%;min-height:0;padding:10px 18px;display:flex}.bubble.bubble-mini.bubble--flower .bubble-body{padding:10px 26px}.bubble.bubble-mini.bubble--heart .bubble-body{padding:6px 20px 24px}.bubble.bubble-mini:before{border-width:2.5px;width:11px;height:11px;bottom:-6px}.bubble.bubble-mini:after{border-width:2.5px;width:6px;height:6px;bottom:-17px}.shape-card.is-active .bubble-art .art-line *{stroke:var(--pink-400)}.shape-card.is-active .bubble-mini:before,.shape-card.is-active .bubble-mini:after{border-color:var(--pink-400)}.bubble.bubble-editor{width:100%;margin:0;font-size:17px;animation:none;transform:none}.bubble.bubble-editor .bubble-body{flex-direction:column;justify-content:center;min-height:130px;display:flex}.bubble.bubble-editor.bubble--flower .bubble-body,.bubble.bubble-editor.bubble--heart .bubble-body{min-height:158px}.grow-wrap{width:100%;display:grid}.grow-wrap:after,.grow-wrap>textarea{font:inherit;color:inherit;letter-spacing:inherit;line-height:inherit;text-align:inherit;white-space:pre-wrap;word-break:break-word;grid-area:1/1;margin:0;padding:0}.grow-wrap:after{content:attr(data-value) " ";visibility:hidden}.grow-wrap>textarea{resize:none;background:0 0;border:none;outline:none;width:100%;overflow:hidden}.grow-wrap>textarea::placeholder{color:var(--pink-300);font-weight:700}.post-meta{color:var(--pink-400);justify-content:flex-end;margin-top:10px;font-size:13px;font-weight:700;display:flex}.post-meta.over{color:#ef5b8b}.send-button{color:#fff;letter-spacing:.06em;cursor:pointer;width:100%;box-shadow:0 8px 0 #e14e87, var(--shadow-soft);background:linear-gradient(#ff9cc5 0%,#f5619b 100%);border:none;border-radius:999px;margin-top:14px;padding:16px 20px;font-size:18px;font-weight:800;transition:transform .12s,box-shadow .12s,opacity .2s}.send-button:hover:not(:disabled){box-shadow:0 10px 0 #e14e87, var(--shadow-pop);transform:translateY(-2px)}.send-button:active:not(:disabled){transform:translateY(5px);box-shadow:0 3px #e14e87}.send-button:disabled{opacity:.45;cursor:not-allowed;box-shadow:0 8px #e14e8766}.hint{text-align:center;color:var(--pink-500);margin-top:14px;font-size:13px;font-weight:700}.preview-label{color:var(--pink-600);margin:30px 0 14px;font-size:14px;font-weight:700}.bubble.bubble-sent{text-align:left;width:100%;margin:0 0 20px;font-size:16px;transform:none}.toast{z-index:10;color:#fff;box-shadow:var(--shadow-pop);background:linear-gradient(#ff9cc5 0%,#f5619b 100%);border-radius:999px;padding:13px 28px;font-weight:800;animation:.4s cubic-bezier(.34,1.56,.64,1) both toast-in;position:fixed;bottom:32px;left:50%;transform:translate(-50%)}@keyframes toast-in{0%{opacity:0;transform:translate(-50%,20px)scale(.9)}to{opacity:1;transform:translate(-50%)scale(1)}}@media (width<=600px){.post{padding:calc(28px + env(safe-area-inset-top)) calc(18px + env(safe-area-inset-right)) calc(40px + env(safe-area-inset-bottom)) calc(18px + env(safe-area-inset-left));justify-content:flex-start}.post .deco span{opacity:.5;font-size:20px}.post-card{border-radius:28px;margin-top:20px;padding:20px 16px}.shape-track{margin-inline:-16px}.bubble.bubble-editor{font-size:16px}.send-button{min-height:56px;font-size:17px}.toast{bottom:calc(24px + env(safe-area-inset-bottom))}}@media (width<=600px) and (height<=620px){.post{padding-top:16px}.post-title{font-size:30px}.post-card{margin-top:14px}}