:root{font-family:Arial Narrow,Pretendard,Noto Sans KR,Arial,sans-serif;color:#25232a;background:#fff;font-synthesis:none;overflow:hidden}*{box-sizing:border-box}html,body,#app{width:100%;height:100%}body{margin:0;cursor:none}.wall-stage{--purple:#5320b4;--green:#63b63a;position:relative;width:100vw;height:100vh;min-height:540px;overflow:hidden;isolation:isolate;background:radial-gradient(circle at 2% 18%,rgba(117,76,197,.09) 0 5.5%,transparent 5.7%),radial-gradient(circle at 98% 17%,rgba(167,202,79,.1) 0 6%,transparent 6.2%),#fff}.connection{position:absolute;z-index:30;top:2.4vh;right:2.2vw;display:flex;align-items:center;gap:.55rem;padding:.45rem .8rem;border:1px solid rgba(38,43,39,.1);border-radius:999px;color:#606460;background:#ffffffd6;font-size:clamp(10px,.72vw,14px);font-weight:800;letter-spacing:.08em}.connection__light{width:.62rem;aspect-ratio:1;border-radius:50%;background:#e0a83a;box-shadow:0 0 0 4px #e0a83a24}.connection[data-state=online] .connection__light{background:#68b63e;box-shadow:0 0 0 4px #68b63e29,0 0 12px #78c74e}.connection[data-state=error] .connection__light{background:#d65964;box-shadow:0 0 0 4px #d6596421}.hero{--hero-border-width:clamp(5px,.55vw,11px);position:absolute;z-index:10;isolation:isolate;top:18.4%;left:24.8%;width:51.5%;height:37.5%;padding:var(--hero-border-width);border-radius:7.5vw;background:linear-gradient(101deg,#4b20b4 2%,#7444cc 30%,#d8c7dd 55%,#6db73d 82%);filter:drop-shadow(0 7px 13px rgba(77,43,123,.08))}.hero__surface{position:relative;z-index:3;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:inherit;background:#fff;text-align:center}.bubble-tail{display:block;position:absolute;overflow:visible;pointer-events:none}.bubble-tail--hero{z-index:2;left:13%;bottom:-4.9vh;width:5.2vw;height:5.8vh}.hero__eyebrow{margin:0 0 .4vh;color:#4d159f;font-size:clamp(23px,3vw,62px);font-weight:950;line-height:1;letter-spacing:-.08em;transform:scaleX(.78)}.hero__eyebrow span{color:transparent;background:linear-gradient(90deg,#a057c8,#66af39);-webkit-background-clip:text;background-clip:text}h1{margin:0;color:transparent;background:linear-gradient(90deg,#3914a0 3%,#a851c4 38%,#ddd3d5 58%,#6ab63b 89%);-webkit-background-clip:text;background-clip:text;font-family:Impact,Haettenschweiler,Arial Narrow Bold,sans-serif;font-size:clamp(57px,8.1vw,165px);font-weight:950;line-height:.86;letter-spacing:-.035em;white-space:nowrap}.hero__description{margin:2vh 0 0;font-size:clamp(17px,1.85vw,38px);font-weight:750;letter-spacing:-.055em}.message-field{position:absolute;top:0;right:0;bottom:0;left:0;z-index:16;pointer-events:none}.visitor-message{--bubble-fill:rgba(255,255,255,.96);--bubble-border-width:clamp(2px,.16vw,4px);position:absolute;isolation:isolate;display:grid;place-items:center;width:clamp(160px,14vw,285px);min-height:clamp(82px,11vh,150px);margin:0;padding:1.1em 1.25em;border:var(--bubble-border-width) solid currentColor;border-radius:2.2vw;background:var(--bubble-fill);font-size:clamp(19px,1.65vw,34px);font-weight:850;line-height:1.3;text-align:center;word-break:keep-all;overflow-wrap:anywhere;filter:drop-shadow(0 8px 10px rgba(78,54,93,.08));animation:bubble-arrive .72s cubic-bezier(.2,1.2,.38,1) both}.visitor-message__text{position:relative;z-index:3}.bubble-tail--message{z-index:2;left:12%;bottom:clamp(-31px,-1.55vw,-17px);width:clamp(24px,2vw,40px);height:clamp(20px,1.8vw,36px);color:inherit}.visitor-message--blue,.visitor-message--purple{color:#6b38c3}.visitor-message--pink{color:#9a54bd}.visitor-message--green{color:#438d36}.visitor-message--yellow{color:#759e39}.visitor-message--green,.visitor-message--yellow{--bubble-fill:rgba(242,249,230,.97)}.participation{position:absolute;z-index:12;left:50%;bottom:13.5%;width:38vw;transform:translate(-50%);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;justify-items:center}.qr-frame{padding:clamp(7px,.55vw,12px);border:clamp(3px,.3vw,6px) solid transparent;border-radius:1.2vw;background:linear-gradient(#fff,#fff) padding-box,linear-gradient(135deg,#7850c9,#7bbb47) border-box;box-shadow:0 7px 17px #3930401f}.qr-frame canvas{display:block;width:clamp(112px,9vw,176px)!important;height:auto!important}.participation p{grid-column:1/-1;margin:1.5vh 0 0;font-size:clamp(15px,1.35vw,28px);font-weight:850;line-height:1.18;text-align:center;letter-spacing:-.04em}.participation p strong{color:transparent;background:linear-gradient(90deg,#6540c7,#60a83d);-webkit-background-clip:text;background-clip:text}.participation__guide{width:100%;display:flex;align-items:center;color:#7149c7}.participation__guide--right{color:#48963a}.guide-line{flex:1;border-top:2px dotted currentColor;opacity:.28}.guide-icon{display:grid;place-items:center;width:3.9vw;aspect-ratio:1;border:.22vw solid currentColor;border-radius:50%;font-size:1.7vw}.guide-icon__svg{display:block;width:52%;height:52%;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.brand-footer{position:absolute;z-index:12;left:50%;bottom:3.6%;transform:translate(-50%);display:flex;align-items:center;gap:1.5vw;white-space:nowrap}.brand{font-family:Impact,Haettenschweiler,sans-serif;font-size:clamp(22px,2.25vw,46px);letter-spacing:-.035em}.brand i{font-style:normal}.brand--rejoice{color:#861c8f}.brand--earth{color:#4b9d45}.brand-divider{width:2px;height:4.2vh;background:#aaa;opacity:.45}.landscape{position:absolute;z-index:2;bottom:-8%;width:45%;height:24%;opacity:.8}.landscape--purple{left:-7%;border-radius:60% 85% 0 0;transform:rotate(5deg);background:linear-gradient(168deg,#8d68da5c 0,#8d68da5c 30%,#602fc1d1 31%,#602fc1d1 55%,#fff0 56%)}.landscape--green{right:-5%;border-radius:90% 60% 0 0;transform:rotate(-4deg);background:linear-gradient(190deg,#9dc76447 0,#9dc76447 31%,#6faf48b8 32%,#6faf48b8 60%,#fff0 61%)}.leaf-cluster{position:absolute;z-index:4;right:24%;bottom:0;width:8vw;height:14vh;border-left:.24vw solid #95bd58;transform:rotate(-8deg);opacity:.55}.leaf-cluster i{position:absolute;width:2.8vw;height:5vh;border-radius:100% 0;background:#a7c95d}.leaf-cluster i:nth-child(1){left:-2.5vw;top:22%;transform:rotate(38deg)}.leaf-cluster i:nth-child(2){left:.2vw;top:8%;transform:rotate(-22deg)}.leaf-cluster i:nth-child(3){left:-2.4vw;top:57%;transform:rotate(28deg)}.leaf-cluster i:nth-child(4){left:.25vw;top:42%;transform:rotate(-30deg)}.ambient{position:absolute;z-index:3;opacity:.7}.ambient--spark-left{top:8%;left:27%;color:#6c38bd;font-size:3.2vw}.ambient--spark-right{top:10%;right:25%;color:#94b644;font-size:2vw}.ambient--heart-left{left:2.8%;bottom:23%;color:#9b75da;font-size:2.4vw}.ambient--heart-right{right:3.5%;bottom:31%;color:#76b748;font-size:2.4vw}@keyframes bubble-arrive{0%{opacity:0;transform:translateY(22px) scale(.76)}to{opacity:1;transform:translateY(0) scale(1)}}@media(max-aspect-ratio:4/3){.hero{left:13%;width:74%;top:21%;height:31%}.visitor-message{width:21vw;min-height:9vh;font-size:clamp(15px,2.2vw,28px)}.participation{bottom:15%;width:52vw}.brand-footer{bottom:4%}}@media(prefers-reduced-motion:reduce){.visitor-message{animation:none}}.visitor-message{transform-origin:center;will-change:transform;animation:bubble-arrive .72s cubic-bezier(.2,1.2,.38,1) both,bubble-float var(--float-duration, 6.4s) ease-in-out .72s infinite alternate}@keyframes bubble-arrive{0%{opacity:0;transform:translateY(22px) scale(.65)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes bubble-float{0%{transform:translate(var(--float-x-start, -.4em),var(--float-y-start, -.2em)) scale(var(--float-scale-min, .986))}48%{transform:translateY(var(--float-y-apex, -.4em)) scale(var(--float-scale-max, 1.014))}to{transform:translate(var(--float-x, .4em),var(--float-y, .3em)) scale(1)}}@media(prefers-reduced-motion:reduce){.visitor-message{animation:none;will-change:auto}}