*{box-sizing:border-box} :root{color-scheme:dark;font-family:Inter,"Segoe UI","Microsoft YaHei",sans-serif;color:#eff1ed;background:#090b0b;font-synthesis:none}body{margin:0;min-height:100svh;overflow-x:hidden}button,textarea{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:2px solid #d4ff81;outline-offset:5px}button:disabled{opacity:.5;cursor:wait}.ambient{position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 70%,#a3cb4d09,transparent 50%),radial-gradient(ellipse at 85% 15%,#285c4a13,transparent 40%);z-index:-1}.ambient:after{content:"";position:absolute;inset:0;background-image:radial-gradient(#a6b7a526 .65px,transparent .65px);background-size:28px 28px;mask-image:linear-gradient(transparent,#0008,transparent)}header{height:104px;margin:0 4.4%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff0b;position:relative;z-index:3}.brand{display:flex;align-items:center;gap:12px;font-size:21px;font-weight:650;letter-spacing:2px}.brand-mark{color:#cefa83;font-size:45px;line-height:1}.brand-sub{display:block;font-size:8px;letter-spacing:3px;color:#778074;margin-top:4px}.controls{display:flex;gap:12px;align-items:center}.live{font-size:11px;color:#92998f;letter-spacing:1px;margin-right:16px;display:flex;align-items:center;gap:9px}.live i,.dock-meta i{display:inline-block;width:5px;height:5px;border-radius:50%;background:#c9f884;box-shadow:0 0 10px #c9f844}.icon-button{border:1px solid #ffffff14;background:#ffffff04;color:#abb4a6;width:34px;height:34px;border-radius:50%;font-size:17px;display:grid;place-items:center}.icon-button:hover{background:#ffffff0d;color:#d4ff81}main{position:relative}.hero{position:relative;height:calc(100svh - 310px);min-height:430px;overflow:hidden;isolation:isolate}.hero-copy{text-align:center;position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;pointer-events:none;padding-bottom:28px;z-index:-1}.eyebrow{color:#859373;font-size:9px;letter-spacing:4px;margin-bottom:22px}h1{font-size:clamp(42px,5.6vw,88px);font-weight:650;letter-spacing:-3px;margin:0;line-height:1.3;color:#dae1d5}h1 span{color:#c9f884} .hero-copy p{color:#78816f;font-size:13px;letter-spacing:5px;margin-top:22px}.sky{position:absolute;inset:20px 0;display:flex;flex-direction:column;justify-content:space-around;gap:8px;mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}.lane{width:100%;display:flex;flex:none;height:40px;opacity:.85}.lane:nth-child(2),.lane:nth-child(5){opacity:.5}.lane:nth-child(3){margin-bottom:70px}.track{display:flex;flex:none;width:max-content;animation:drift var(--duration,90s) linear infinite;animation-delay:var(--delay,0s)}.lane:nth-child(even) .track{animation-direction:reverse}.group{display:flex;gap:36px;padding-right:36px;align-items:center;flex-shrink:0}.bubble{flex:none;display:flex;align-items:center;gap:12px;max-width:380px;height:44px;padding:0 20px 0 10px;background:#171c19e8;border:1px solid #ffffff12;border-radius:30px;color:#d2d9cd;font-size:13px;box-shadow:0 5px 25px #0002;white-space:nowrap;transition:border-color .2s,background .2s}.bubble:hover{background:#242c20;border-color:#c9f866}.bubble-text{overflow:hidden;text-overflow:ellipsis;max-width:280px}.avatar{display:grid;place-items:center;flex:none;width:25px;height:25px;border-radius:50%;background:#3d4933;color:#c6d9a6;font-size:10px}.bubble[data-tone="1"] .avatar{background:#3c344c;color:#c5b3e8}.bubble[data-tone="2"] .avatar{background:#24433f;color:#91d4c9}.bubble[data-tone="3"] .avatar{background:#4c3c2b;color:#e4c393}.bubble.mine{border-color:#b9ef72a6;background:#27321e;color:#deffac;box-shadow:0 0 22px #c9f819}.lane:hover .track,.lane:focus-within .track,.paused .track{animation-play-state:paused}.empty{position:absolute;bottom:17px;width:100%;text-align:center;font-size:12px;color:#7e8979;padding:0 30px;line-height:1.8;margin:0}.empty:empty{display:none}.dock{position:relative;z-index:2;width:min(620px,calc(100% - 40px));margin:9px auto 0}.notice{min-height:21px;margin:0 0 9px;text-align:center;color:#c9f884;font-size:12px;line-height:1.7}.notice.error{color:#e9aa90}form{display:flex;align-items:center;gap:17px;padding:10px 10px 10px 22px;border:1px solid #ffffff29;border-radius:20px;background:#171b17;box-shadow:0 14px 70px #0009,0 0 55px #a7d65906;transition:border-color .2s}form:focus-within{border-color:#bfed7e75;box-shadow:0 0 0 3px #c9f806,0 14px 70px #0009}.input-star{color:#98a58a;font-size:24px}textarea{flex:1;min-width:0;resize:none;max-height:110px;background:none;outline:none;border:0;padding:10px 0;color:#ecf2e5;font-size:14px;line-height:24px;scrollbar-width:thin}textarea::placeholder{color:#727b6c}#submit{height:48px;border:0;border-radius:13px;background:#cefa83;color:#263316;padding:0 19px;display:flex;align-items:center;gap:17px;font-size:13px;font-weight:650;flex:none}#submit:hover{background:#dfffaa}.send-arrow{font-size:24px;line-height:1}.dock-meta{display:flex;justify-content:space-between;gap:10px;font-size:10px;color:#687260;margin:15px 6px}.dock-meta>span:first-child{display:flex;align-items:center;gap:8px}.dock-meta i{width:4px;height:4px;background:#758467;box-shadow:none}.key-hint{color:#515b4d}footer{min-height:64px;margin:0 4.4%;display:flex;align-items:center;justify-content:space-between;gap:15px;font-size:9px;letter-spacing:1.4px;color:#495342}.footer-star{font-size:19px;margin-left:12px;vertical-align:middle;color:#7f9169}dialog{width:min(540px,calc(100% - 36px));padding:25px;border:1px solid #a9c08733;border-radius:22px;background:#171d16;color:#e6eddf;box-shadow:0 25px 100px #0008}dialog::backdrop{background:#0009;backdrop-filter:blur(8px)}.dialog-top,.dialog-bottom{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:11px;color:#95a487}.dialog-top .icon-button{font-size:23px}#detail-content{font-size:17px;line-height:1.9;white-space:pre-wrap;overflow-wrap:anywhere;max-height:55svh;overflow:auto;padding:6px 0}.dialog-bottom{font-size:10px;border-top:1px solid #ffffff0c;padding-top:18px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}[hidden]{display:none!important}@keyframes drift{to{transform:translateX(-50%)}}@media(min-width:1500px){.group{gap:65px;padding-right:65px}}@media(max-width:650px){header{height:82px;margin:0 22px}.brand{font-size:18px}.brand-mark{font-size:38px}.controls{gap:8px}.live{margin-right:5px;font-size:10px;letter-spacing:0}.hero{height:calc(100svh - 290px);min-height:370px}.eyebrow{font-size:8px;letter-spacing:2px}h1{font-size:39px;letter-spacing:-2px}.hero-copy p{font-size:11px;letter-spacing:3px}.sky{inset:10px 0}.lane{height:34px}.lane:nth-child(3){margin-bottom:80px}.bubble{height:37px;font-size:12px;max-width:270px;gap:8px;padding-right:14px}.bubble-text{max-width:210px}.group{gap:22px;padding-right:22px}.avatar{width:22px;height:22px}.dock{margin-top:0}form{gap:10px;padding-left:16px;border-radius:17px}textarea{font-size:16px}#submit{padding:0 13px;gap:10px;height:44px}.dock-meta{font-size:9px}.key-hint{display:none}footer{font-size:8px;margin:0 23px;min-height:55px;letter-spacing:.5px}footer>span:first-child{max-width:130px;line-height:1.8}.footer-star{display:none}.empty{font-size:11px;bottom:0}}@media(prefers-reduced-motion:reduce){.track{animation:none!important}.sky{overflow-y:auto;mask-image:none;justify-content:flex-start;gap:12px;padding:15px 20px}.lane{height:auto!important;margin:0!important;opacity:1!important}.track{width:100%;display:block}.group{width:100%;flex-wrap:wrap;gap:10px;padding:0}.group[aria-hidden="true"]{display:none}.bubble{max-width:100%}.hero-copy{opacity:.2}*{scroll-behavior:auto!important}}

@media(prefers-reduced-motion:reduce){.bubble[aria-hidden="true"]{display:none}}

/* Constellation edition: one comment, one floating object. */
:root{background:#06090d}
body{background:radial-gradient(ellipse at 50% 45%,#112d2c55,transparent 60%)}
.ambient{background:radial-gradient(ellipse at 20% 20%,#5537a326,transparent 45%),radial-gradient(ellipse at 80% 68%,#82f88e17,transparent 40%)}
.ambient:after{background-image:none}
header{height:88px;border-color:#ffffff0a}
.starfield{position:fixed;inset:0;pointer-events:none;z-index:0;overflow:hidden}
.starfield i{position:absolute;left:var(--sx);top:var(--sy);width:2px;height:2px;background:#d7eec5;border-radius:50%;box-shadow:0 0 9px #a0e5b866;animation:twinkle 7s ease-in-out infinite;animation-delay:var(--delay)}
.starfield i:nth-child(3n){width:1px;height:1px;background:#8494df}
.hero{height:calc(100svh - 290px);min-height:480px}
.hero-copy{z-index:1;padding-bottom:0;pointer-events:none}
.eyebrow{font-size:9px;letter-spacing:3px;color:#9abbaa;margin-bottom:21px}
h1{font-size:clamp(44px,5.2vw,82px);font-weight:750;letter-spacing:-3px;line-height:1.14;text-shadow:0 4px 40px #0005}
h1>span{display:block;background:linear-gradient(105deg,#b0f9bd 25%,#dbff91 60%,#85f0cc);background-clip:text;-webkit-text-fill-color:transparent}
.title-dot{color:#d3ff8b}.hero-copy p{font-size:12px;color:#a0b6a7;letter-spacing:5px;margin-top:22px}
.orbital{position:absolute;width:min(64vw,780px);height:min(64vw,780px);left:50%;top:49%;transform:translate(-50%,-50%);pointer-events:none;z-index:0}
.planet-glow{position:absolute;inset:20%;border-radius:50%;background:radial-gradient(circle at 35% 30%,#99e5bc15,#1836350c 45%,#060b0d 73%);box-shadow:inset 0 0 55px #84e9b713,0 0 95px #89eb9710;border:1px solid #a1ebba12}
.orbital-ring{position:absolute;inset:7%;border:1px solid #a5e8bb35;border-radius:50%;transform:rotate(-24deg) scaleY(.45);box-shadow:0 0 20px #73e5a00b}
.orbital-ring:after{content:"";position:absolute;left:10%;top:18%;width:7px;height:7px;border-radius:50%;background:#d2ff9d;box-shadow:0 0 20px #baff91,0 0 50px #a1ffa0}
.ring-two{inset:12%;transform:rotate(34deg) scaleY(.62);border-color:#9aaff025}
.ring-two:after{left:84%;top:12%;width:4px;height:4px;background:#9ba9ff;box-shadow:0 0 20px #9ba9ff}
.sky{inset:15px 0;display:block;mask-image:none;overflow:visible;z-index:2;pointer-events:none}
.floating-comment{position:absolute;pointer-events:auto;max-width:300px;height:48px;gap:11px;padding:0 19px 0 11px;background:linear-gradient(120deg,#24312fe8,#10191de8);border:1px solid #bbf6d126;border-radius:15px;box-shadow:0 12px 35px #0005,inset 0 1px #ffffff08;backdrop-filter:blur(14px);animation:levitate var(--float-time) ease-in-out infinite;animation-delay:var(--float-delay);will-change:transform;transform:rotate(var(--tilt));font-size:13px}
.floating-comment:before{content:"";position:absolute;right:16px;bottom:-4px;width:6px;height:6px;background:#baff8b;border-radius:50%;box-shadow:0 0 12px #baff8b88}
.floating-comment[data-tone="1"]{border-color:#b1a0ff35;background:linear-gradient(120deg,#27223ce8,#141720ed)}
.floating-comment[data-tone="1"]:before{background:#b1a0ff;box-shadow:0 0 12px #b1a0ff88}
.floating-comment[data-tone="2"]{border-color:#72e0d135}.floating-comment[data-tone="3"]{border-color:#e4c39335}
.floating-comment .bubble-text{max-width:235px}.floating-comment .avatar{border-radius:9px}
.floating-comment:hover,.floating-comment:focus-visible{animation-play-state:paused;border-color:#d2ff9c;z-index:5;background:#25352f}
.paused .floating-comment{animation-play-state:paused}.floating-comment.mine{border-color:#c9fa83;box-shadow:0 0 30px #c9fa8320;background:#2a3926}
.dock{margin-top:0;width:min(640px,calc(100% - 40px))}form{border-radius:23px;background:linear-gradient(120deg,#1d2927e8,#141c20f0);border-color:#b1efcb30;box-shadow:0 0 0 5px #a2e4bb03,0 18px 70px #0008}#submit{background:linear-gradient(120deg,#dcff9e,#aef3b0);box-shadow:0 0 22px #c9fa8312}
footer{position:relative;z-index:1}.empty{z-index:3}
@keyframes levitate{0%,100%{transform:translate3d(0,0,0) rotate(var(--tilt))}35%{transform:translate3d(13px,-15px,0) rotate(1deg)}70%{transform:translate3d(-7px,10px,0) rotate(-1deg)}}
@keyframes twinkle{0%,100%{opacity:.2}50%{opacity:.8}}
@media(max-width:650px){header{height:76px}.hero{min-height:450px;height:calc(100svh - 290px)}.hero-copy{padding:0}.hero-copy h1{font-size:44px}.hero-copy p{font-size:11px;letter-spacing:3px}.eyebrow{font-size:7px;letter-spacing:1.5px}.orbital{width:540px;height:540px}.sky{inset:10px 0}.floating-comment{max-width:215px;height:40px;font-size:12px;padding-right:13px;gap:8px}.floating-comment .bubble-text{max-width:160px}.dock{margin-top:0}}
@media(prefers-reduced-motion:reduce){.starfield i,.floating-comment{animation:none!important}.sky{display:block;overflow:visible;padding:0}.hero-copy{opacity:1}.floating-comment{transform:none;will-change:auto}}
footer{justify-content:flex-end}footer>span:first-child{max-width:none}
.dock-meta{justify-content:flex-end}.dock-meta>span:first-child{display:inline}

/* Clear, readable composer hints. */
.dock-meta{align-items:center;gap:18px;margin:12px 12px 0;color:#a8b8af;font-size:12px;line-height:22px;letter-spacing:.2px}
.dock-meta .character-count{font-variant-numeric:tabular-nums;white-space:nowrap}
.dock-meta #counter{color:#dde9df;font-weight:600}
.dock-meta .key-hint{display:inline-flex;align-items:center;gap:8px;color:#bccdbf;padding-left:18px;border-left:1px solid #a5c3b52b}
.key-hint kbd{font:inherit;font-size:11px;line-height:20px;padding:1px 7px;color:#d8e9d5;background:#bedfc00b;border:1px solid #a8c8b43d;border-bottom-width:2px;border-radius:5px}
@media(max-width:650px){.dock-meta{font-size:11px;margin-right:12px}.dock-meta .key-hint{display:none}}

/* Balanced text-only send button. */
#submit{min-width:92px;justify-content:center;gap:0;padding:0 24px;border-radius:15px;font-size:14px;letter-spacing:2px;font-weight:650;box-shadow:0 3px 14px #b8f58d18,inset 0 1px 0 #ffffff40}
@media(max-width:650px){#submit{min-width:78px;padding:0 18px;font-size:13px;border-radius:13px}}

#submit{gap:10px;letter-spacing:1px}.rocket-icon{width:20px;height:20px;flex:none;transition:transform .2s ease}#submit:hover .rocket-icon{transform:translate(1px,-1px)}@media(prefers-reduced-motion:reduce){.rocket-icon{transition:none}#submit:hover .rocket-icon{transform:none}}

/* Minimal invitation: let the comments take the spotlight. */
.hero-copy h1{font-size:clamp(36px,4vw,58px);font-weight:600;letter-spacing:2px;line-height:1.3;color:#dce8dc}.hero-copy h1>.title-question{display:inline;background:none;-webkit-text-fill-color:initial;color:#c9fa83}.hero-copy{padding:0}@media(max-width:650px){.hero-copy h1{font-size:36px;letter-spacing:1px}}

/* Multilingual interface and bidirectional user content. */
.brand-word{font-size:18px;letter-spacing:3px;font-weight:650}.language-control{display:flex;align-items:center;gap:8px;color:#a9bcb2;border:1px solid #b5d8c322;border-radius:20px;padding:7px 10px;background:#13201b66}.language-control select{font:inherit;font-size:12px;background:transparent;color:#dce7dc;border:0;cursor:pointer;max-width:100px;outline-offset:4px}.language-control option{background:#17211d;color:#eff4ef}.bubble-text{unicode-bidi:plaintext;text-align:start;min-width:0}.floating-comment{min-width:0}.floating-comment .bubble-text{display:block}.avatar{unicode-bidi:isolate}#detail-content{unicode-bidi:plaintext;text-align:start;overflow-wrap:anywhere}#detail-name{unicode-bidi:plaintext;overflow-wrap:anywhere;max-width:55%}#content{text-align:start;unicode-bidi:plaintext}html[lang="en"] #submit{letter-spacing:.3px}html[lang="en"] footer{letter-spacing:.4px}header{gap:16px}@media(max-width:650px){.brand-word{font-size:15px;letter-spacing:2px}.language-control{padding:6px 8px;gap:5px}.language-control select{font-size:12px}html[lang="en"] #submit{min-width:88px;padding:0 15px}html[lang="en"] footer{font-size:10px}}

.hero-copy{padding:0 24px}.hero-copy h1{margin:0 auto;max-width:90%;text-wrap:balance}html[lang="en"] .hero-copy h1{font-size:clamp(28px,3.5vw,50px);letter-spacing:-1px;max-width:620px}@media(max-width:650px){html[lang="en"] .hero-copy h1{font-size:30px;max-width:280px;line-height:1.3}}

/* Launch button: hover charge, tactile press, request and success states. */
#submit{position:relative;isolation:isolate;overflow:hidden;transform:translateY(0);background:linear-gradient(115deg,#dcff9e,#aef3b0);transition:transform .24s cubic-bezier(.2,.8,.2,1),box-shadow .24s ease,filter .24s ease;box-shadow:inset 0 1px 0 #ffffff70,0 4px 14px #9ceba512}
#submit>span,#submit>.rocket-icon{position:relative;z-index:2}
#submit::before{content:'';position:absolute;inset:-50% -40%;z-index:1;pointer-events:none;background:linear-gradient(110deg,transparent 35%,#ffffff90 49%,transparent 63%);transform:translateX(-120%);opacity:0}
#submit::after{content:'';position:absolute;inset:3px;border:1px solid #ffffff80;border-radius:inherit;opacity:0;transition:opacity .24s;pointer-events:none}
#submit .rocket-icon{transition:transform .3s cubic-bezier(.2,.8,.2,1);transform:translate(0,0)}
#submit:hover .rocket-icon{transform:none}
#submit:focus-visible{outline:2px solid #ddffa3;outline-offset:5px;box-shadow:0 0 0 5px #c5fc7b12,0 0 28px #c5fc7b40}
@media(hover:hover) and (pointer:fine){
 #submit:not(:disabled):hover{transform:translateY(-3px);filter:brightness(1.06);background:linear-gradient(115deg,#e4ffb4,#aff8c6);box-shadow:0 8px 22px #b2f58b35,0 0 36px #a4f7bc20,inset 0 1px 0 #ffffffb0}
 #submit:not(:disabled):hover::before{animation:launch-sheen .8s ease-out both}
 #submit:not(:disabled):hover::after{opacity:1}
 #submit:not(:disabled):hover .rocket-icon{transform:translate(2px,-2px) rotate(-7deg)}
}
#submit:not(:disabled):active{transform:translateY(1px) scale(.96);box-shadow:0 1px 8px #b2f58b30;transition-duration:.08s}
#submit.is-sending{opacity:1;cursor:wait;transform:none;filter:saturate(.8)}
#submit.is-sending::before{animation:launch-sheen 1.4s ease-in-out infinite}
#submit.is-sending .rocket-icon{animation:rocket-charge .8s ease-in-out infinite}
#submit.is-sent{animation:launch-confirm .85s ease-out}
#submit.is-sent .rocket-icon{animation:rocket-launch .7s cubic-bezier(.2,.7,.3,1)}
@keyframes launch-sheen{0%{opacity:0;transform:translateX(-100%)}20%{opacity:.8}100%{opacity:0;transform:translateX(100%)}}
@keyframes rocket-charge{0%,100%{transform:translate(0,0)}50%{transform:translate(2px,-2px)}}
@keyframes rocket-launch{0%{transform:translate(0,0);opacity:1}45%{transform:translate(22px,-22px);opacity:0}46%{transform:translate(-15px,15px);opacity:0}100%{transform:translate(0,0);opacity:1}}
@keyframes launch-confirm{0%,100%{box-shadow:0 4px 14px #9ceba512}35%{box-shadow:0 0 0 6px #c5fc7b25,0 0 40px #a4f7bc55}}
@media(prefers-reduced-motion:reduce){
 #submit,#submit .rocket-icon,#submit::after{transition:none!important}
 #submit,#submit::before,#submit .rocket-icon{animation:none!important}
 #submit:not(:disabled):hover,#submit:not(:disabled):active,#submit:not(:disabled):hover .rocket-icon{transform:none}
 #submit.is-sending{filter:saturate(.5)}#submit.is-sent{box-shadow:0 0 0 2px #c5fc7b90}
}

/* Message detail: quiet glass, generous typography, no author label. */
#detail{width:min(560px,calc(100% - 36px));max-height:calc(100svh - 48px);padding:30px 34px 26px;border:1px solid #c4e7dc26;border-radius:26px;background:radial-gradient(ellipse at 0 0,#74998a14,transparent 65%),linear-gradient(145deg,#151f23fa,#0d1419fc);box-shadow:0 35px 120px #0009,inset 0 1px 0 #e2fff312;overflow-y:auto;color:#ecf3ee}
#detail::backdrop{background:#02070bb3;backdrop-filter:blur(12px)}
#detail .dialog-top{align-items:center;min-height:36px}.quote-mark{color:#c7f79d;opacity:.8}
#detail #close-detail{width:34px;height:34px;border:1px solid #c4ded212;background:#d8eee506;color:#a6bbb2;transition:background .18s,color .18s,transform .18s}
#detail #close-detail:hover{background:#d8eee518;color:#e2f7df;transform:rotate(90deg)}
#detail-content{font-size:26px;font-weight:450;line-height:1.65;letter-spacing:.2px;margin:25px 0 32px;padding:0;max-height:50svh;overflow:auto;scrollbar-width:thin;scrollbar-color:#7b9b8655 transparent}
#detail.long-message #detail-content{font-size:18px;line-height:1.9}
#detail .dialog-bottom{border:0;padding:0;justify-content:flex-start;gap:8px;color:#8da59a;font-size:11px;line-height:20px;font-variant-numeric:tabular-nums;letter-spacing:.3px}
#detail .dialog-bottom svg{opacity:.7;flex:none}
@media(prefers-reduced-motion:no-preference){#detail[open]{animation:detail-arrive .22s ease-out}@keyframes detail-arrive{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}}
@media(max-width:650px){#detail{padding:24px;border-radius:22px}#detail-content{font-size:23px;margin:22px 0 28px}#detail.long-message #detail-content{font-size:17px}#detail .dialog-bottom{font-size:10px}}
@media(prefers-reduced-motion:reduce){#detail #close-detail{transition:none}#detail #close-detail:hover{transform:none}}

/* Text-only floating comments, with balanced spacing. */
.floating-comment{padding-inline:18px;gap:0}.floating-comment .bubble-text{max-width:264px}@media(max-width:650px){.floating-comment{padding-inline:14px}.floating-comment .bubble-text{max-width:187px}}

/* One-at-a-time rotation: keep floating transforms and positions intact. */
.floating-comment{transition:opacity .32s ease,border-color .2s,background .2s;opacity:1}.floating-comment.comment-leaving{opacity:0;transition:opacity .24s ease}
@media(prefers-reduced-motion:reduce){.floating-comment,.floating-comment.comment-leaving{transition:none}}

/* Slot widths reserve space for long replacements and motion. */
.floating-comment .bubble-text{max-width:100%;min-width:0;flex:1}.floating-comment{box-sizing:border-box}@media(max-width:650px){.floating-comment{padding-inline:12px}}

/* Let short messages wrap naturally before truncating longer messages. */
.floating-comment{height:auto;min-height:48px;padding:12px 18px;white-space:normal}
.floating-comment .bubble-text{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;line-height:20px;max-height:40px;overflow:hidden;overflow-wrap:anywhere;white-space:normal;text-overflow:ellipsis;flex:initial}
@media(max-width:650px){.floating-comment{min-height:40px;padding:10px 12px}.floating-comment .bubble-text{line-height:18px;max-height:36px}}

@keyframes levitate-compact{0%,100%{transform:translate3d(0,0,0) rotate(var(--tilt))}35%{transform:translate3d(4px,-6px,0) rotate(1deg)}70%{transform:translate3d(-3px,5px,0) rotate(-1deg)}}@media(max-width:650px){.floating-comment{animation-name:levitate-compact}}