@layer app{@scope (.join-root){:scope{--i: 0;--delay: 0s;--color: var(--gold);--glow: transparent;--pc: var(--gold);--focus-color: var(--gold)}@keyframes rise-in{0%{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}@keyframes splash-out{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.95)}}@keyframes btn-pulse{0%,to{box-shadow:0 0 color-mix(in srgb,var(--gold),transparent 100%)}50%{box-shadow:0 0 28px 6px color-mix(in srgb,var(--gold),transparent 78%)}}@keyframes particle-float{0%{opacity:0;transform:translateY(0) scale(1)}15%{opacity:.7}80%{opacity:.2}to{opacity:0;transform:translateY(-140px) scale(.4)}}@keyframes ring-appear{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes circle-pop{0%{opacity:0;transform:scale(.15)}60%{opacity:1;transform:scale(1.1)}78%{transform:scale(.94)}90%{transform:scale(1.04)}to{opacity:1;transform:scale(1)}}@keyframes circle-breathe{0%,to{transform:scale(1)}50%{transform:scale(1.045)}}@keyframes burst{0%{transform:scale(1)}35%{transform:scale(1.16)}65%{transform:scale(.96)}to{transform:scale(1)}}@keyframes conn-flow{0%{stroke-dashoffset:28}to{stroke-dashoffset:0}}@keyframes conn-appear{0%{opacity:0}to{opacity:1}}@keyframes enter-appear{0%{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}@keyframes enter-glow{0%,to{box-shadow:0 0 var(--space-3) color-mix(in srgb,var(--gold),transparent 70%),0 0 var(--space-5) color-mix(in srgb,var(--gold),transparent 90%)}50%{box-shadow:0 0 var(--space-5) color-mix(in srgb,var(--gold),transparent 45%),0 0 calc(var(--space-8) + var(--space-2)) color-mix(in srgb,var(--gold),transparent 80%)}}@keyframes sheet-in{0%{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes sheet-out{0%{transform:translateY(0)}to{transform:translateY(102%)}}@keyframes backdrop-in{0%{opacity:0}to{opacity:1}}@keyframes backdrop-out{0%{opacity:1}to{opacity:0}}@keyframes welcome-in{0%{opacity:0;transform:scale(1.04)}to{opacity:1;transform:scale(1)}}@keyframes pillar-rise{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}@keyframes crest-glow{0%,to{filter:drop-shadow(0 0 6px color-mix(in srgb,var(--gold),transparent 60%))}50%{filter:drop-shadow(0 0 16px color-mix(in srgb,var(--gold),transparent 20%))}}@keyframes complete-ring-pulse{0%,to{opacity:.35}50%{opacity:.75}}.join-root{min-height:100%;background:var(--bg-sunken);overflow:hidden;position:relative}.splash{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}.splash--out{animation:splash-out .55s cubic-bezier(.4,0,1,1) forwards}.splash-bg{position:absolute;inset:0;background:radial-gradient(ellipse 80% 65% at 50% 38%,var(--bg-elevated) 0%,var(--bg-sunken) 65%);pointer-events:none}.splash-particles{position:absolute;inset:0;pointer-events:none;overflow:hidden}.particle{position:absolute;width:2px;height:2px;border-radius:50%;background:color-mix(in srgb,var(--gold),transparent 45%);animation:particle-float calc(5s + var(--i, 0) * .4s) ease-in-out calc(var(--i, 0) * .45s) infinite;left:calc(8% + var(--i, 0) * 7.2%);bottom:15%}.splash-content{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;padding:2rem;user-select:none}.crest-wrap{color:var(--gold);margin-bottom:1.4rem;animation:rise-in .9s ease .05s both,crest-glow 3s ease-in-out 1.2s infinite}.wordmark{font-family:Playfair Display,serif;font-weight:500;font-size:clamp(2.6rem,10vw,3.4rem);letter-spacing:.16em;color:var(--text);text-transform:uppercase;line-height:1;margin-bottom:.25rem;animation:rise-in .9s ease .22s both}.flourish{width:var(--col-200, 200px);height:auto;margin-bottom:1.4rem;animation:rise-in .9s ease .34s both}.splash-sub{font-family:DM Sans,sans-serif;font-size:var(--text-sm);font-weight:300;letter-spacing:.1em;color:color-mix(in srgb,var(--gold),transparent 35%);margin-bottom:2.8rem;animation:rise-in .9s ease .46s both}.begin-btn{font-family:Playfair Display,serif;font-size:var(--text-base);font-weight:400;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);background:transparent;border:1px solid color-mix(in srgb,var(--gold),transparent 55%);padding:.8rem 2.6rem;border-radius:var(--radius-pill);cursor:pointer;transition:background .2s,border-color .2s,box-shadow .2s;animation:rise-in .9s ease .62s both,btn-pulse 2.8s ease-in-out 1.6s infinite}.begin-btn:hover{background:color-mix(in srgb,var(--gold),transparent 93%);border-color:color-mix(in srgb,var(--gold),transparent 15%)}.begin-btn:active{transform:scale(.97)}.ring-screen{min-height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;padding:1.5rem 1rem calc(env(safe-area-inset-bottom) + 1.5rem);background:radial-gradient(ellipse 90% 70% at 50% 35%,var(--bg-elevated) 0%,var(--bg-sunken) 60%);opacity:0}.ring-screen--in{animation:ring-appear .5s ease .05s both;opacity:1}.ring-hint{font-size:var(--text-3xs);font-weight:400;letter-spacing:.14em;text-transform:uppercase;color:color-mix(in srgb,var(--gold),transparent 45%);margin-bottom:1.8rem;text-align:center;min-height:1.2em;transition:opacity .3s}.ring-container{position:relative;width:min(var(--col-340, 340px),calc(100% - var(--space-1-5)));aspect-ratio:360 / 340;margin:0 auto}.conn-svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.conn-line{stroke:color-mix(in srgb,var(--gold),transparent 90%);stroke-width:1;stroke-dasharray:6 9;transition:stroke .6s,stroke-width .6s,opacity .6s}.ring-screen--in .conn-line{animation:conn-appear .8s ease .6s both}.conn-line.conn-line--active{stroke:color-mix(in srgb,var(--gold),transparent 60%);stroke-width:1.5;animation:conn-flow 2.5s linear infinite}.ring-screen--complete .conn-line{stroke:color-mix(in srgb,var(--gold),transparent 45%);stroke-width:1.5;animation:conn-flow 1.8s linear infinite,complete-ring-pulse 2s ease-in-out infinite}.circle-node{position:absolute;width:27.8%;aspect-ratio:1;border-radius:50%;cursor:pointer;opacity:0;transition:opacity .1s;padding:0;border:none;background:transparent;-webkit-tap-highlight-color:transparent}.circle-node--you{top:.8%;left:36.1%}.circle-node--palace{top:55.8%;left:6.1%}.circle-node--butler{top:55.8%;left:66.1%}.ring-screen--in .circle-node{animation:circle-pop .65s cubic-bezier(.34,1.56,.64,1) var(--delay, 0s) both}.ring-screen--in .circle-node.circle-node--not-filled{animation:circle-pop .65s cubic-bezier(.34,1.56,.64,1) var(--delay, 0s) both,circle-breathe 4.5s ease-in-out calc(var(--delay, 0s) + .9s) infinite}.circle-body{width:100%;height:100%;border-radius:50%;background:color-mix(in srgb,var(--text),transparent 97%);border:1px solid color-mix(in srgb,var(--text),transparent 90%);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-0h);transition:background .4s,border-color .4s,box-shadow .4s;color:color-mix(in srgb,var(--text),transparent 60%);position:relative;overflow:hidden}.circle-body:after{content:"";position:absolute;inset:2px;border-radius:50%;background:linear-gradient(140deg,color-mix(in srgb,var(--text),transparent 94%) 0%,transparent 55%);pointer-events:none}.circle-node--filled .circle-body{border-color:var(--color, var(--gold));background:color-mix(in srgb,var(--text),transparent 95%);box-shadow:0 0 0 1px var(--color, var(--gold)),0 0 var(--space-2) var(--glow, transparent),inset 0 0 var(--space-2) color-mix(in srgb,var(--bg-sunken),transparent 80%);color:color-mix(in srgb,var(--text),transparent 15%)}.circle-node:hover .circle-body{border-color:color-mix(in srgb,var(--text),transparent 75%);background:color-mix(in srgb,var(--text),transparent 95%);box-shadow:0 0 20px var(--glow, color-mix(in srgb, var(--gold), transparent 80%))}.circle-node:active .circle-body{transform:scale(.94);transition:transform .1s}.ring-screen--complete .circle-node .circle-body{animation:burst .4s ease both}.ring-screen--complete .circle-node--you .circle-body{animation-delay:0s}.ring-screen--complete .circle-node--palace .circle-body{animation-delay:.08s}.ring-screen--complete .circle-node--butler .circle-body{animation-delay:.16s}.circle-icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:transform .2s}.circle-node:hover .circle-icon{transform:scale(1.08)}.circle-display-name{font-size:var(--text-3xs);font-weight:500;letter-spacing:.05em;color:var(--color, var(--text));text-align:center;max-width:72%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.2}.circle-label{position:absolute;bottom:calc(-1 * var(--space-3));left:50%;transform:translate(-50%);font-size:var(--text-2xs);font-weight:400;letter-spacing:.06em;color:color-mix(in srgb,var(--text),transparent 65%);white-space:nowrap;transition:color .3s}.circle-node--filled .circle-label{color:color-mix(in srgb,var(--text),transparent 40%)}.enter-zone{margin-top:3.2rem;opacity:0;pointer-events:none;transition:opacity .1s}.enter-zone--in{animation:enter-appear .6s cubic-bezier(.34,1.56,.64,1) .1s both;pointer-events:auto}.enter-btn{font-family:Playfair Display,serif;font-size:var(--text-base);font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--bg-sunken);background:linear-gradient(135deg,var(--gold-bright),var(--gold) 50%,var(--gold-dim));border:none;padding:.9rem 2.8rem;border-radius:var(--radius-pill);cursor:pointer;text-decoration:none;display:inline-block;transition:transform .2s,box-shadow .2s;animation:enter-glow 2.5s ease-in-out .4s infinite}.enter-btn:hover{transform:translateY(-2px);box-shadow:0 var(--space-1) 30px color-mix(in srgb,var(--gold),transparent 60%)}.enter-btn:active{transform:scale(.97) translateY(0)}.sheet-dialog{border:none;background:transparent;padding:0;max-width:100%;max-height:100%;width:100%;height:100%;display:flex;align-items:flex-end}.sheet-dialog::backdrop{background:color-mix(in srgb,var(--bg-sunken),transparent 35%);backdrop-filter:blur(6px)}.sheet{width:100%;max-height:85dvh;background:var(--bg-elevated);border-top-left-radius:var(--radius-xl);border-top-right-radius:var(--radius-xl);overflow-y:auto;overscroll-behavior:contain;transform:translateY(100%);position:relative;padding-bottom:calc(env(safe-area-inset-bottom) + 1rem)}.sheet--in{animation:sheet-in .42s cubic-bezier(.34,1.26,.64,1) forwards}.sheet--out{animation:sheet-out .32s cubic-bezier(.4,0,.6,1) forwards}.sheet-handle{width:var(--space-4);height:var(--space-0h);background:color-mix(in srgb,var(--text),transparent 88%);border-radius:2px;margin:var(--space-1) auto 0}.sheet-close{position:absolute;top:var(--space-1);right:var(--space-2);width:var(--space-4);height:var(--space-4);border-radius:50%;background:color-mix(in srgb,var(--text),transparent 93%);border:none;color:color-mix(in srgb,var(--text),transparent 55%);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s,color .2s}.sheet-close:hover{background:color-mix(in srgb,var(--text),transparent 88%);color:color-mix(in srgb,var(--text),transparent 20%)}.sheet-accent{height:2px;background:linear-gradient(90deg,transparent,var(--color, var(--gold)),transparent);margin:var(--space-2) 0 0;opacity:.6}.form-body{padding:1.2rem 1.5rem 1.8rem;display:flex;flex-direction:column;align-items:center}.form-icon{margin-bottom:.8rem;opacity:.9}.form-title{font-family:Playfair Display,serif;font-weight:500;font-size:var(--text-xl);color:var(--text);letter-spacing:.02em;margin-bottom:.3rem;text-align:center}.form-sub{font-size:var(--text-xs);font-weight:300;color:color-mix(in srgb,var(--text),transparent 55%);letter-spacing:.04em;margin-bottom:1.8rem;text-align:center}.form-fields{width:100%;display:flex;flex-direction:column;gap:1.2rem;margin-bottom:1.8rem}.field{display:flex;flex-direction:column;gap:.45rem}.field-label{font-size:var(--text-3xs);font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:color-mix(in srgb,var(--text),transparent 60%)}.field-input{width:100%;background:color-mix(in srgb,var(--text),transparent 95%);border:1px solid color-mix(in srgb,var(--text),transparent 90%);border-radius:var(--radius-sm);padding:.75rem 1rem;font-family:DM Sans,sans-serif;font-size:var(--text-base);color:var(--text);outline:none;transition:border-color .2s,box-shadow .2s,background .2s;appearance:none}.field-input::placeholder{color:color-mix(in srgb,var(--text),transparent 80%)}.field-input:focus{border-color:var(--gold, color-mix(in srgb, var(--gold), transparent 40%));background:color-mix(in srgb,var(--text),transparent 93%);box-shadow:0 0 0 3px color-mix(in srgb,var(--gold var(--gold)) 15%,transparent)}.lang-toggle{display:flex;gap:0;border:1px solid color-mix(in srgb,var(--text),transparent 90%);border-radius:var(--radius-sm);overflow:hidden}.lang-opt{flex:1;padding:.55rem .6rem;border:none;background:transparent;color:color-mix(in srgb,var(--text),transparent 50%);font-family:Playfair Display,serif;font-size:var(--text-sm);letter-spacing:.06em;cursor:pointer;transition:background .2s,color .2s}.lang-opt--active{color:var(--text)}.save-btn{width:100%;padding:.9rem;border-radius:var(--radius-md);border:none;background:var(--color, var(--gold));color:var(--bg-sunken);font-family:Playfair Display,serif;font-size:var(--text-base);font-weight:500;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;transition:opacity .2s,transform .15s,box-shadow .2s}.save-btn:disabled{opacity:.3;cursor:not-allowed}.save-btn:hover:not(:disabled){box-shadow:0 var(--space-0h) 20px color-mix(in srgb,var(--color, var(--gold)) 45%,transparent);transform:translateY(-1px)}.save-btn:active:not(:disabled){transform:scale(.98)}.welcome{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:var(--bg-sunken);opacity:0;z-index:100}.welcome--in{animation:welcome-in .7s ease forwards}.welcome-bg{position:absolute;inset:0;background:radial-gradient(ellipse 85% 70% at 50% 40%,var(--bg-elevated) 0%,var(--bg-sunken) 65%)}.welcome-content{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;text-align:center;padding:2rem 1.5rem;gap:0}.crest-wrap--big{color:var(--gold);margin-bottom:1.6rem;animation:rise-in .8s ease .15s both,crest-glow 3s ease-in-out 1s infinite}.welcome-label{font-size:var(--text-3xs);font-weight:300;letter-spacing:.18em;text-transform:uppercase;color:color-mix(in srgb,var(--gold),transparent 40%);margin-bottom:.9rem;animation:rise-in .8s ease .3s both}.welcome-name{font-family:Playfair Display,serif;font-size:clamp(2rem,8vw,2.8rem);font-weight:500;color:var(--text);letter-spacing:.04em;margin-bottom:.3rem;animation:rise-in .8s ease .42s both}.welcome-palace{font-family:Playfair Display,serif;font-style:italic;font-size:var(--text-lg);color:color-mix(in srgb,var(--gold),transparent 30%);letter-spacing:.06em;margin-bottom:2.2rem;animation:rise-in .8s ease .52s both}.welcome-pillars{display:flex;gap:1rem;margin-bottom:2.8rem;flex-wrap:wrap;justify-content:center}.welcome-pillar{display:flex;flex-direction:column;align-items:center;gap:var(--space-0h);padding:.7rem 1.1rem;border-radius:var(--radius-md);border:1px solid color-mix(in srgb,var(--pc, var(--gold)) 30%,transparent);background:color-mix(in srgb,var(--pc, var(--gold)) 8%,transparent);animation:pillar-rise .7s ease both;min-width:var(--col-200, 200px)}.welcome-pillar:nth-child(1){animation-delay:.62s}.welcome-pillar:nth-child(2){animation-delay:.72s}.welcome-pillar:nth-child(3){animation-delay:.82s}.pillar-icon{display:flex;align-items:center;justify-content:center;margin-bottom:var(--space-0h);opacity:.85}.pillar-label{font-size:var(--text-3xs);font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--pc, var(--gold));opacity:.75}.pillar-name{font-size:var(--text-md);font-weight:400;color:color-mix(in srgb,var(--text),transparent 15%)}.enter-btn--gold{animation:rise-in .8s ease .95s both,enter-glow 2.5s ease-in-out 1.5s infinite}}}