.interactive-logo-section{position:relative;padding:6rem 2rem;min-height:700px;overflow:hidden}.interactive-logo-section .section-header{text-align:center;margin-bottom:1rem;position:relative;z-index:2}.interactive-logo-section .section-header h2{font-size:clamp(2rem,4vw,3rem);margin:0 0 .5rem;letter-spacing:-.02em;font-family:var(--font-heading);color:var(--text-primary)}.interactive-logo-section .section-header .highlight{background:var(--accent-gradient);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.interactive-logo-section .section-header .subtitle{font-size:1.1rem;color:var(--text-secondary);font-family:var(--font-code);margin:0}.logo-explore-container{display:flex;align-items:stretch;gap:0;max-width:1100px;margin:0 auto;min-height:clamp(400px,60vw,640px);position:relative}.logo-canvas-wrap{flex:1;min-height:clamp(400px,60vw,640px);position:relative;transition:flex .45s cubic-bezier(.4,0,.2,1);border-radius:16px;overflow:hidden;border:1px solid rgba(255,255,255,.04);background:#0e101799}.logo-canvas-wrap.shrunk{flex:.45;min-height:clamp(400px,60vw,640px)}.logo-hint{position:absolute;bottom:1.5rem;left:50%;transform:translate(-50%);font-family:var(--font-code);font-size:.8rem;color:#ffffff4d;letter-spacing:.05em;pointer-events:none;transition:opacity .3s ease;z-index:5;white-space:nowrap}.logo-hint.hidden{opacity:0}.detail-panel-wrap{flex:0;position:relative;overflow:hidden;min-width:0;background:transparent;transition:flex .45s cubic-bezier(.4,0,.2,1)}.detail-panel-wrap.open{flex:.55}.operator-detail{padding:0;position:absolute;inset:0;overflow:hidden;display:flex;flex-direction:column}.detail-scroll-area{flex:1;overflow-y:auto;padding:2rem 2rem 1.5rem;mask-image:linear-gradient(to bottom,black calc(100% - 20px),transparent 100%)}.detail-close{position:absolute;top:1rem;right:1rem;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);color:#ffffff80;width:32px;height:32px;border-radius:8px;cursor:pointer;font-size:14px;display:flex;align-items:center;justify-content:center;transition:all .2s ease;z-index:10}.detail-close:hover{background:#ffffff1a;color:#ffffffe6}.detail-header{display:flex;align-items:flex-start;gap:1.25rem;margin-bottom:1.75rem}.detail-symbol-wrap{width:56px;height:56px;border-radius:14px;border:2px solid;background:#0e1017cc;display:flex;align-items:center;justify-content:center;flex-shrink:0}.detail-symbol{font-family:var(--font-code);font-size:26px;font-weight:700}.detail-meta{flex:1;min-width:0}.detail-name{font-family:var(--font-code);font-size:1.3rem;font-weight:700;margin:0 0 .35rem;text-transform:uppercase;letter-spacing:.05em}.detail-story{font-size:.92rem;line-height:1.5;color:var(--text-secondary);margin:0 0 .6rem}.detail-stats{display:flex;gap:.5rem}.stat-badge{font-family:var(--font-code);font-size:.75rem;font-weight:600;padding:.2rem .6rem;border-radius:6px}.planes-grid{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;margin-bottom:1.5rem}.plane-card{background:#0e101799;border:1px solid rgba(255,255,255,.06);border-radius:10px;padding:.85rem 1rem;animation:cardSlideIn .35s ease forwards;opacity:0;transform:translateY(8px)}@keyframes cardSlideIn{to{opacity:1;transform:translateY(0)}}.plane-card.plane-invalid{opacity:0}.plane-card.plane-invalid .plane-header,.plane-card.plane-invalid .plane-body{opacity:.4}.plane-header{display:flex;align-items:center;gap:.5rem;margin-bottom:.5rem}.plane-icon{display:flex;align-items:center;justify-content:center;width:20px;height:20px;color:var(--text-secondary);flex-shrink:0}.plane-name{font-family:var(--font-heading);font-size:.85rem;font-weight:600;color:var(--text-primary);flex:1}.plane-symbol{font-family:var(--font-code);font-size:.7rem;color:#767b93}.validity-badge{width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700}.validity-badge.valid{background:#14b8a626;color:#14b8a6}.validity-badge.invalid{background:#ffffff0a;color:#fff3}.plane-body{min-height:0}.plane-body.inactive{opacity:.5}.plane-example{display:block;font-family:var(--font-code);font-size:.75rem;line-height:1.6;padding:.5rem .75rem;background:#0000004d;border-radius:6px;border-left:3px solid;margin-bottom:.4rem;word-break:break-all;white-space:pre-wrap}.ex-operator{font-weight:700}.ex-plane{color:#d2a8ff}.ex-rest{color:#a5d6ff}.plane-desc{font-size:.78rem;line-height:1.4;color:var(--text-secondary);margin:0}.operator-nav{display:flex;justify-content:center;gap:.5rem;padding:.5rem 0 .75rem;margin-top:auto;background:transparent;position:relative}.operator-nav:before{content:"";position:absolute;top:0;left:0;right:0;margin:0 auto;width:66.666%;height:1px;background:#ffffff0f}.nav-op{font-family:var(--font-code);font-weight:700;width:70px;aspect-ratio:1;padding:.4rem .25rem;border-radius:10px;border:2px solid transparent;background:#ffffff08;cursor:pointer;transition:all .2s ease;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.15rem}.nav-op-symbol{font-size:1.2rem;line-height:1}.nav-op-name{font-size:.55rem;text-transform:uppercase;letter-spacing:.06em;opacity:.6}.nav-op:hover,.nav-op.nav-active{background:#ffffff0f}.mobile-operator-picker,.mobile-nav-arrows{display:none}@media(max-width:900px){.logo-explore-container{flex-direction:column}.logo-canvas-wrap,.desktop-operator-picker{display:none}.mobile-operator-picker{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem;padding:1rem;border-radius:16px;border:1px solid rgba(255,255,255,.04);background:#0e101799}.mobile-op-btn{display:flex;flex-direction:column;align-items:center;gap:.4rem;padding:1rem .5rem;border-radius:12px;border:1.5px solid rgba(255,255,255,.1);background:#ffffff08;cursor:pointer;transition:all .25s ease;font-family:var(--font-code, "JetBrains Mono", monospace)}.mobile-op-btn:hover,.mobile-op-btn:focus-visible{background:#ffffff0f;border-color:var(--op-color, rgba(255, 255, 255, .2))}.mobile-op-btn.active{background:#ffffff14;box-shadow:0 0 20px rgba(var(--op-color),.15)}.mobile-op-symbol{font-size:1.6rem;font-weight:700;line-height:1}.mobile-op-name{font-size:.65rem;text-transform:uppercase;letter-spacing:.08em;opacity:.7}.mobile-nav-arrows{display:flex;align-items:center;justify-content:space-between;padding:.6rem .25rem;gap:.5rem}.mobile-arrow{background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:8px;color:#fff9;padding:.4rem .75rem;font-family:var(--font-code, "JetBrains Mono", monospace);font-size:.7rem;cursor:pointer;transition:all .2s ease;white-space:nowrap}.mobile-arrow:hover,.mobile-arrow:focus-visible{background:#ffffff1a;border-color:#fff3;color:#ffffffe6}.mobile-nav-counter{font-family:var(--font-code, "JetBrains Mono", monospace);font-size:.7rem;color:#ffffff59;flex-shrink:0}.detail-panel-wrap{flex:unset;max-height:0;transition:max-height .45s cubic-bezier(.4,0,.2,1);overflow:hidden}.detail-panel-wrap.open{flex:unset;max-height:none;overflow:visible}.detail-close,.operator-nav{display:none}.operator-detail{position:static;padding:1.5rem 1.25rem 1rem}.planes-grid{grid-template-columns:1fr}.detail-header{flex-direction:column;align-items:center;text-align:center}}@media(max-width:480px){.interactive-logo-section{padding:4rem .75rem;min-height:auto}.logo-canvas-wrap{min-height:clamp(240px,70vw,320px)}}.playground{padding:1.5rem 1.5rem 3rem;max-width:1400px;margin:0 auto;min-height:80vh}.playground__loading{text-align:center;padding:4rem 2rem;color:var(--accent-primary);font-family:var(--font-code);font-size:1.1rem}.playground__loading .dots{animation:blink 1.2s steps(4) infinite}@keyframes blink{0%{opacity:0}50%{opacity:1}to{opacity:0}}.playground__error{text-align:center;padding:4rem 2rem;color:var(--danger)}.playground__grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:1rem;height:600px}.playground__grid--loading{opacity:.3;pointer-events:none}.playground__panel{background:var(--bg-card);border:1px solid rgba(255,255,255,.06);border-radius:12px;display:flex;flex-direction:column;overflow:hidden;min-height:0}.panel__header{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1rem;border-bottom:1px solid rgba(255,255,255,.06);background:#0e101780;position:relative}.panel__header h3{margin:0;font-size:.85rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--text-secondary)}.mode-toggle{display:flex;background:#0e101799;border-radius:6px;padding:2px}.mode-btn{padding:.25rem .75rem;border:none;background:transparent;color:var(--text-secondary);font-family:var(--font-code);font-size:.75rem;font-weight:600;cursor:pointer;border-radius:4px;transition:all .15s ease}.mode-btn--active{background:var(--accent-primary);color:#fff}.input-wrapper{position:relative;flex:1;display:flex}.input-area{flex:1;min-height:0;padding:.75rem 1rem;background:transparent;border:none;color:var(--text-primary);font-family:var(--font-code);font-size:.85rem;line-height:1.5;resize:none;outline:none}.input-area::placeholder{color:#fff3}.rotating-hint{position:absolute;top:1rem;left:1rem;right:1rem;pointer-events:none;font-family:var(--font-code);font-size:.9rem;line-height:1.6;opacity:0;transition:opacity .3s ease;text-shadow:0 0 12px rgba(128,90,213,.3)}.rotating-hint--visible{opacity:1}.rotating-hint__prefix{color:#805ad599;font-weight:600}.rotating-hint__text{color:#ffffff40;animation:hint-glow 3s ease-in-out infinite}@keyframes hint-glow{0%,to{text-shadow:0 0 8px rgba(128,90,213,.15)}50%{text-shadow:0 0 16px rgba(128,90,213,.4)}}.parse-feedback{display:flex;align-items:center;gap:.4rem;padding:.4rem 1rem;border-top:1px solid rgba(255,255,255,.04);background:#0e10174d;flex-wrap:wrap}.parse-feedback__label{font-family:var(--font-code);font-size:.65rem;color:#ffffff4d;text-transform:uppercase;letter-spacing:.06em;margin-right:.2rem}.parse-pill{font-family:var(--font-code);font-size:.65rem;font-weight:600;padding:.1rem .45rem;border-radius:3px;transition:all .2s ease}.parse-pill--operator{background:#805ad533;color:#b794f4;border:1px solid rgba(128,90,213,.3)}.parse-pill--plane{background:#63b3ed26;color:#63b3ed;border:1px solid rgba(99,179,237,.25)}.parse-pill--target{background:#68d39126;color:#68d391;border:1px solid rgba(104,211,145,.25)}.parse-pill--missing{background:#fc81811a;color:#fc8181b3;border:1px dashed rgba(252,129,129,.3);font-style:italic}.grammar-guide{padding:.6rem 1rem;border-top:1px solid rgba(255,255,255,.04);background:#805ad508;border-bottom:1px solid rgba(128,90,213,.08);animation:guide-glow 4s ease-in-out infinite}@keyframes guide-glow{0%,to{box-shadow:inset 0 0 10px #805ad505;border-bottom-color:#805ad50f}50%{box-shadow:inset 0 0 20px #805ad50f;border-bottom-color:#805ad526}}.grammar-guide__pattern{display:flex;align-items:center;gap:.3rem;margin-bottom:.35rem}.grammar-guide__slot{font-family:var(--font-code);font-size:.7rem;font-weight:600;padding:.15rem .5rem;border-radius:4px;border:1px dashed}.grammar-guide__slot--verb{color:#b794f4;border-color:#805ad559;background:#805ad514}.grammar-guide__slot--noun{color:#63b3ed;border-color:#63b3ed4d;background:#63b3ed14}.grammar-guide__slot--target{color:#68d391;border-color:#68d3914d;background:#68d39114}.grammar-guide__slot--filter{color:#ecc94b;border-color:#ecc94b4d;background:#ecc94b14}.grammar-guide__plus{color:#ffffff26;font-size:.65rem;font-weight:300}.grammar-guide__examples{font-family:var(--font-code);font-size:.6rem;color:#fff3;letter-spacing:.02em}.guided-form{padding:.5rem .75rem;display:flex;flex-direction:column;gap:.4rem;flex:1;min-height:0;overflow:hidden}.guided-field{display:flex;flex-direction:column;gap:.3rem}.guided-label{font-family:var(--font-code);font-size:.65rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em}.guided-label--verb{color:#b794f4}.guided-label--noun{color:#63b3ed}.guided-label--target{color:#68d391}.guided-label--filter{color:#ecc94b}.guided-label--building{color:#d6bcfa}.guided-label--presets{color:#81e6d9}.guided-options{display:flex;flex-wrap:wrap;gap:.3rem}.guided-option{display:flex;align-items:center;gap:.25rem;padding:.2rem .5rem;border:1px solid rgba(255,255,255,.08);border-radius:6px;background:#0e101780;color:var(--text-secondary);font-family:var(--font-code);font-size:.7rem;cursor:pointer;transition:all .15s ease}.guided-option:hover{border-color:#ffffff26;background:#ffffff0a}.guided-option--active{border-color:currentColor}.guided-option--verb.guided-option--active{background:#805ad526;border-color:#805ad566;color:#b794f4}.guided-option--noun.guided-option--active{background:#63b3ed1f;border-color:#63b3ed59;color:#63b3ed}.guided-option__symbol{font-weight:700;font-size:.9rem;opacity:.7}.guided-option--active .guided-option__symbol{opacity:1}.guided-option__label{font-weight:500}.guided-input{padding:.4rem .6rem;border:1px solid rgba(255,255,255,.08);border-radius:6px;background:#0e101780;color:var(--text-primary);font-family:var(--font-code);font-size:.8rem;outline:none;transition:border-color .15s ease}.guided-input:focus{border-color:#805ad566}.guided-input::placeholder{color:#ffffff26}.guided-preview{display:flex;align-items:flex-start;gap:.5rem;padding:.5rem .6rem;border:1px solid rgba(128,90,213,.15);border-radius:6px;background:#805ad50d;animation:guide-glow 4s ease-in-out infinite;min-height:4rem}.guided-preview__label{font-family:var(--font-code);font-size:.65rem;color:#ffffff4d;text-transform:uppercase;letter-spacing:.06em}.guided-preview__ctx{font-family:var(--font-code);font-size:1rem;font-weight:700}.gp-op{color:#b794f4}.gp-plane{color:#63b3ed}.gp-target{color:#68d391}.gp-filter{color:#ecc94b}.examples{display:flex;flex-direction:column;gap:.3rem;padding:.5rem .75rem}.guided-form .examples{padding:0}.examples__label{font-family:var(--font-code);font-size:.65rem;font-weight:700;color:#81e6d9;text-transform:uppercase;letter-spacing:.08em;display:block;margin-bottom:.3rem}.examples__list{display:flex;flex-wrap:wrap;gap:.35rem}.example-btn{padding:.2rem .6rem;border:1px solid rgba(128,90,213,.25);background:#805ad514;color:var(--accent-primary);font-family:var(--font-code);font-size:.7rem;border-radius:4px;cursor:pointer;transition:all .15s ease}.example-btn:hover{background:#805ad533;border-color:var(--accent-primary)}.ctx-output{padding:.75rem 1rem;min-height:0;overflow:hidden}.ctx-output__code{font-family:var(--font-code);font-size:1rem;font-weight:700;color:var(--accent-primary);line-height:1.4;word-break:break-all}.ctx-output__placeholder{font-family:var(--font-code);font-size:.85rem;color:#ffffff26}.ctx-output__hint{display:flex;align-items:flex-start;gap:.5rem;font-size:.85rem;color:var(--text-secondary);line-height:1.5}.hint-icon{display:flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;background:#ecc94b26;color:#ecc94b;font-size:.75rem;font-weight:700;flex-shrink:0;margin-top:1px}.confidence{font-family:var(--font-code);font-size:.7rem;font-weight:600;padding:.15rem .5rem;border-radius:4px}.confidence--high{background:#68d39126;color:#68d391}.confidence--medium{background:#ecc94b26;color:#ecc94b}.confidence--low{background:#fc818126;color:#fc8181}.token-comparison{padding:.5rem 1rem;border-top:1px solid rgba(255,255,255,.06)}.token-comparison h4{margin:0 0 .5rem;font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--text-secondary);opacity:.6}.token-bars{display:flex;flex-direction:column;gap:.35rem}.token-bar{display:flex;align-items:center;gap:.5rem}.token-bar__label{font-family:var(--font-code);font-size:.7rem;color:var(--text-secondary);width:64px;flex-shrink:0}.token-bar__track{flex:1;height:6px;background:#ffffff0f;border-radius:3px;overflow:hidden}.token-bar__fill{height:100%;border-radius:3px;transition:width .3s ease}.token-bar__fill--prose{background:var(--text-secondary)}.token-bar__fill--ctx{background:var(--accent-primary)}.token-bar__fill--json{background:#ecc94b99}.token-bar__fill--target{background:#63b3ed99}.token-bar__value{font-family:var(--font-code);font-size:.7rem;color:var(--text-secondary);width:30px;text-align:right;flex-shrink:0}.ast-section{padding:0 1rem .75rem}.ast-toggle{background:none;border:none;color:var(--text-secondary);font-family:var(--font-code);font-size:.75rem;cursor:pointer;padding:.25rem 0;opacity:.6;transition:opacity .15s}.ast-toggle:hover{opacity:1}.ast-code{margin:.5rem 0 0;padding:.75rem;background:#0e101799;border:1px solid rgba(255,255,255,.06);border-radius:6px;font-family:var(--font-code);font-size:.7rem;color:var(--text-secondary);overflow-x:auto;line-height:1.5;max-height:200px;overflow-y:auto}.target-tabs{display:flex;padding:0 .5rem;border-bottom:1px solid rgba(255,255,255,.06);overflow-x:auto;scrollbar-width:none}.target-tabs::-webkit-scrollbar{display:none}.target-tab{padding:.5rem .75rem;border:none;background:transparent;color:var(--text-secondary);font-family:var(--font-code);font-size:.7rem;font-weight:600;cursor:pointer;border-bottom:2px solid transparent;transition:all .15s ease;white-space:nowrap;opacity:.6}.target-tab:hover{opacity:1}.target-tab--active{color:var(--accent-primary);border-bottom-color:var(--accent-primary);opacity:1}.translation-output{flex:1;padding:.75rem 1rem;overflow:hidden;min-height:0}.translation-code{margin:0;font-family:var(--font-code);font-size:.85rem;color:var(--text-primary);line-height:1.6;white-space:pre-wrap;word-break:break-word}.translation-placeholder{font-family:var(--font-code);font-size:.85rem;color:#ffffff26}.playground__footer{display:flex;justify-content:space-between;align-items:center;padding:1rem 0;margin-top:1rem}.footer-badge{font-family:var(--font-code);font-size:.7rem;color:var(--text-secondary);opacity:.5}.footer-link{font-family:var(--font-code);font-size:.75rem;color:var(--accent-primary);text-decoration:none;opacity:.7;transition:opacity .15s}.footer-link:hover{opacity:1}.mode-btn--import{color:#d53f8cb3;display:inline-flex;align-items:center}.mode-btn--import:hover{color:#d53f8c}.mode-btn--import-active{background:linear-gradient(135deg,#d53f8c,#805ad5)!important;color:#fff!important}.import-input{border-left:2px solid rgba(213,63,140,.2)}.import-input:focus{border-left-color:#d53f8c80}.import-detection{display:flex;align-items:center;gap:.5rem;padding:.4rem 1rem;border-top:1px solid rgba(255,255,255,.04);background:#d53f8c08;flex-wrap:wrap}.import-detection__label{font-family:var(--font-code);font-size:.65rem;color:#ffffff4d;text-transform:uppercase;letter-spacing:.06em}.format-badge{font-family:var(--font-code);font-size:.7rem;font-weight:600;padding:.15rem .6rem;border-radius:4px;animation:badge-appear .3s ease-out}@keyframes badge-appear{0%{opacity:0;transform:scale(.85)}to{opacity:1;transform:scale(1)}}.format-badge--detected{background:#d53f8c26;color:#ed64a6;border:1px solid rgba(213,63,140,.3)}.format-badge__confidence{margin-left:.3rem;opacity:.6;font-weight:400;font-size:.65rem}.format-badge--unknown{background:#ffffff0d;color:#ffffff4d;border:1px dashed rgba(255,255,255,.15)}.format-candidates{display:flex;flex-direction:column;gap:.3rem;flex:1}.format-candidate{display:flex;align-items:center;gap:.5rem}.format-candidate__label{font-family:var(--font-code);font-size:.65rem;font-weight:600;color:var(--text-secondary);background:#ffffff0a;border:1px solid rgba(255,255,255,.08);border-radius:3px;padding:.1rem .4rem;cursor:pointer;min-width:70px;text-align:center;transition:all .15s ease}.format-candidate__label:hover{border-color:#d53f8c4d;color:#ed64a6}.format-candidate__label--selected{background:#d53f8c26;border-color:#d53f8c66;color:#ed64a6}.confidence-bar{flex:1;height:4px;background:#ffffff0f;border-radius:2px;overflow:hidden}.confidence-bar__fill{height:100%;border-radius:2px;background:linear-gradient(90deg,#d53f8c,#805ad5);transition:width .3s ease}.format-candidate__pct{font-family:var(--font-code);font-size:.6rem;color:var(--text-secondary);opacity:.5;min-width:28px;text-align:right}.manual-override{font-family:var(--font-code);font-size:.65rem;padding:.15rem .4rem;border:1px solid rgba(255,255,255,.1);border-radius:4px;background:#0e101799;color:var(--text-secondary);cursor:pointer;outline:none;margin-left:auto}.manual-override:focus{border-color:#d53f8c66}.import-warnings{display:flex;flex-wrap:wrap;gap:.3rem;padding:.3rem 1rem;border-top:1px solid rgba(255,255,255,.04)}.warning-pill{font-family:var(--font-code);font-size:.6rem;font-weight:600;padding:.1rem .45rem;border-radius:3px;background:#ed893626;color:#ed8936;border:1px solid rgba(237,137,54,.25);cursor:default}.import-error{display:flex;align-items:center;gap:.5rem;padding:.4rem 1rem;border-top:1px solid rgba(252,129,129,.1);background:#fc818108}.import-error__code{font-family:var(--font-code);font-size:.65rem;font-weight:700;color:#fc8181;background:#fc81811a;padding:.1rem .35rem;border-radius:3px}.import-error__detail{font-family:var(--font-code);font-size:.7rem;color:#fc8181b3}.example-btn--import{border-color:#d53f8c40;background:#d53f8c14;color:#d53f8c}.example-btn--import:hover{background:#d53f8c33;border-color:#d53f8c}.ctx-output__code--import{color:#ed64a6;text-shadow:0 0 12px rgba(213,63,140,.2)}.import-action-btn{font-family:var(--font-code);font-size:.7rem;font-weight:600;padding:.2rem .6rem;border:1px solid rgba(213,63,140,.3);border-radius:4px;background:#d53f8c1a;color:#ed64a6;cursor:pointer;transition:all .2s ease}.import-action-btn:hover{background:#d53f8c40;border-color:#d53f8c;box-shadow:0 0 12px #d53f8c33}.roundtrip-section{padding:.5rem 1rem;border-top:1px solid rgba(255,255,255,.06)}.roundtrip-toggle{display:flex;align-items:center;gap:.4rem;cursor:pointer;user-select:none}.roundtrip-toggle input[type=checkbox]{appearance:none;-webkit-appearance:none;width:14px;height:14px;border:1px solid rgba(255,255,255,.15);border-radius:3px;background:#0e101780;cursor:pointer;position:relative;transition:all .15s ease}.roundtrip-toggle input[type=checkbox]:checked{background:#d53f8c33;border-color:#d53f8c80}.roundtrip-toggle input[type=checkbox]:checked:after{content:"✓";position:absolute;top:-1px;left:2px;font-size:.6rem;color:#ed64a6}.roundtrip-toggle__label{font-family:var(--font-code);font-size:.65rem;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.06em}.roundtrip-panel{margin-top:.5rem;padding:.5rem;border:1px solid rgba(255,255,255,.06);border-radius:6px;background:#0e101766}.roundtrip-indicator{display:flex;align-items:center;gap:.4rem;margin-bottom:.4rem}.roundtrip-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}.roundtrip-dot--green{background:#68d391;box-shadow:0 0 6px #68d39166}.roundtrip-dot--red{background:#fc8181;box-shadow:0 0 6px #fc818166}.roundtrip-indicator__text{font-family:var(--font-code);font-size:.7rem;color:var(--text-secondary)}.roundtrip-compare{margin-top:.3rem}.roundtrip-col__label{font-family:var(--font-code);font-size:.6rem;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.06em;display:block;margin-bottom:.2rem;opacity:.5}.roundtrip-col__code{margin:0;padding:.4rem;background:#0e101780;border:1px solid rgba(255,255,255,.04);border-radius:4px;font-family:var(--font-code);font-size:.7rem;color:var(--text-secondary);white-space:pre-wrap;line-height:1.4;max-height:100px;overflow-y:auto}.roundtrip-diff{margin-top:.3rem;display:flex;flex-wrap:wrap;gap:.25rem;align-items:center}.roundtrip-diff__label{font-family:var(--font-code);font-size:.6rem;color:#ffffff4d;text-transform:uppercase;letter-spacing:.06em}.roundtrip-diff__item{font-family:var(--font-code);font-size:.6rem;padding:.1rem .35rem;border-radius:3px;background:#fc81811a;color:#fc8181;border:1px solid rgba(252,129,129,.2)}.ctx-hl-op{color:#b794f4;font-weight:800}.ctx-hl-plane{color:#63b3ed;font-weight:800}.ctx-hl-target{color:#68d391}.ctx-hl-tag{color:#ecc94b}.ctx-hl-time{color:#f687b3}.ctx-hl-limit{color:#fc8181}.ctx-hl-payload{color:#a0aec0;font-style:italic}.copy-btn{display:inline-flex;align-items:center;justify-content:center;padding:.25rem;border:1px solid rgba(255,255,255,.08);border-radius:4px;background:#ffffff08;color:var(--text-secondary);cursor:pointer;transition:all .15s ease;opacity:.5;flex-shrink:0}.copy-btn:hover{opacity:1;border-color:#805ad566;background:#805ad51a;color:#b794f4}.copy-btn--copied{opacity:1;border-color:#68d39166;background:#68d3911a;animation:copy-flash .3s ease}@keyframes copy-flash{0%{transform:scale(1)}50%{transform:scale(1.15)}to{transform:scale(1)}}.mode-toggle-wrapper{display:flex;align-items:center;gap:.35rem}.share-url-btn{display:inline-flex;align-items:center;justify-content:center;padding:.2rem;border:1px solid rgba(255,255,255,.08);border-radius:4px;background:transparent;color:var(--text-secondary);cursor:pointer;transition:all .15s ease;opacity:.5}.share-url-btn:hover{opacity:1;border-color:#68d39166;color:#68d391}.matrix-toggle-btn{display:inline-flex;align-items:center;justify-content:center;padding:.2rem;border:1px solid rgba(255,255,255,.08);border-radius:4px;background:transparent;color:var(--text-secondary);cursor:pointer;transition:all .15s ease;opacity:.5}.matrix-toggle-btn:hover{opacity:1;border-color:#805ad566;color:#b794f4}.matrix-toggle-btn--active{opacity:1;border-color:#805ad566;background:#805ad51a;color:#b794f4}.validity-matrix{position:absolute;top:100%;left:0;right:0;z-index:50;padding:.5rem .75rem;background:var(--bg-card, #141620);border:1px solid rgba(128,90,213,.25);border-radius:0 0 8px 8px;box-shadow:0 8px 24px #0006;animation:badge-appear .2s ease-out}.validity-matrix__header,.validity-matrix__row{display:grid;grid-template-columns:28px repeat(7,1fr);gap:2px}.validity-matrix__corner{width:28px}.validity-matrix__col-label,.validity-matrix__row-label{font-family:var(--font-code);font-size:.7rem;font-weight:700;color:var(--text-secondary);display:flex;align-items:center;justify-content:center;height:26px}.validity-matrix__col-label{color:#63b3ed}.validity-matrix__row-label{color:#b794f4}.validity-cell{font-family:var(--font-code);font-size:.7rem;font-weight:700;height:26px;border:none;border-radius:3px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .12s ease}.validity-cell--valid{background:#68d3911f;color:#68d391;border:1px solid rgba(104,211,145,.15)}.validity-cell--valid:hover{background:#68d39140;border-color:#68d39166;transform:scale(1.1)}.validity-cell--invalid{background:#ffffff05;color:#ffffff1a;border:1px solid rgba(255,255,255,.03);cursor:default}.tour-overlay{position:absolute;top:5.5rem;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:1rem;z-index:100;padding:.4rem .8rem;border-radius:8px;background:#805ad51f;border:1px solid rgba(128,90,213,.25);backdrop-filter:blur(8px);animation:tour-slide-in .4s ease-out}@keyframes tour-slide-in{0%{opacity:0;transform:translate(-50%) translateY(-10px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.tour-label{font-family:var(--font-code);font-size:.75rem;font-weight:600;color:#b794f4;white-space:nowrap}.skip-tour-btn{padding:.15rem .5rem;border:1px solid rgba(255,255,255,.15);border-radius:4px;background:#ffffff0d;color:var(--text-secondary);font-family:var(--font-code);font-size:.65rem;cursor:pointer;transition:all .15s ease;white-space:nowrap}.skip-tour-btn:hover{border-color:#ffffff4d;color:var(--text-primary)}@media(max-width:768px){.playground__grid{grid-template-columns:1fr;height:auto;gap:.75rem}.playground__panel{min-height:auto}.playground__translations,.mode-toggle-wrapper .mode-toggle,.matrix-toggle-btn,.share-url-btn,.validity-matrix,.token-savings,.ast-section{display:none}.input-area{min-height:60px;font-size:.85rem}.panel__header{padding:.5rem .75rem}.panel__header h3{font-size:.75rem}.preset-btn{font-size:.6rem;padding:.25rem .4rem}.target-tab{font-size:.6rem;padding:.3rem .4rem}.tour-overlay{top:4.5rem;font-size:.7rem;padding:.3rem .6rem}.playground{padding:1rem .75rem 2rem}}.mobile-desktop-prompt{display:none}@media(max-width:768px){.mobile-desktop-prompt{display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.6rem 1rem;margin-top:.75rem;border-radius:8px;background:#805ad50f;border:1px solid rgba(128,90,213,.12);font-family:var(--font-code);font-size:.7rem;color:var(--text-secondary);text-align:center}.mobile-desktop-prompt svg{flex-shrink:0;color:#b794f4}}.playground-page:where(.astro-5wq3ak55){min-height:80vh}.playground-transition:where(.astro-5wq3ak55){padding:3rem 2rem 2rem;text-align:center}.transition-divider:where(.astro-5wq3ak55){width:80px;height:3px;background:var(--accent-gradient);border-radius:2px;margin:0 auto 2rem;opacity:.6}.playground-transition:where(.astro-5wq3ak55) h2:where(.astro-5wq3ak55){font-size:clamp(1.5rem,3vw,2.25rem);margin:0 0 .75rem}.playground-transition:where(.astro-5wq3ak55) .subtitle:where(.astro-5wq3ak55){color:var(--text-secondary);font-size:1rem;max-width:600px;margin:0 auto}.highlight:where(.astro-5wq3ak55){background:var(--accent-gradient);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
