.portal-screen{position:relative;min-height:100svh;width:100%;overflow:hidden;isolation:isolate;color:#e7f5f3;background:radial-gradient(circle at 50% 45%,rgba(0,255,220,.1),transparent 45%),#020403}.portal-bg{position:absolute;inset:0;z-index:0;pointer-events:none;background-image:url(/brand/palmtreeos-hero-wide.png);background-size:cover;background-position:50%;background-repeat:no-repeat}@media (orientation:portrait){.portal-bg{background-image:url(/brand/palmtreeos-hero-portrait.png)}}.portal-vignette{position:absolute;inset:0;z-index:2;background:linear-gradient(180deg,rgba(0,0,0,.4) 0,transparent 18%),linear-gradient(0deg,rgba(0,0,0,.55) 0,transparent 30%),radial-gradient(120% 90% at 50% 45%,transparent 60%,rgba(0,0,0,.45) 100%)}.portal-caption{position:absolute;top:calc(.9rem + env(safe-area-inset-top));left:50%;transform:translateX(-50%);z-index:5;display:flex;flex-direction:column;gap:.3rem;width:100%;padding:0 1.5rem;text-align:center;font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:rgba(202,226,222,.55)}.portal-caption span{font-size:9px;letter-spacing:.26em;color:rgba(148,178,173,.4)}@media (orientation:portrait){.portal-caption{display:none}}.portal-controls{position:absolute;left:50%;bottom:calc(clamp(1.75rem, 5.5vh, 4.5rem) + env(safe-area-inset-bottom));transform:translateX(-50%);z-index:10;display:flex;flex-direction:column;align-items:center;gap:1rem;width:min(380px,calc(100vw - 2.5rem))}.bg-scanlines{background:repeating-linear-gradient(180deg,hsla(0,0%,100%,.028) 0,hsla(0,0%,100%,.028) 1px,transparent 0,transparent 4px)}.bg-noise,.bg-scanlines{position:absolute;inset:0;z-index:2}.bg-noise{opacity:.05;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}.portal-heading{font-size:.8rem;text-transform:uppercase;letter-spacing:.24em;color:rgba(212,226,222,.9)}.portal-form{display:flex;width:100%;flex-direction:column;align-items:center;gap:.875rem}.portal-error{min-height:1.25rem;font-size:.85rem;letter-spacing:.08em;text-align:center;color:hsla(8,100%,78%,.92)}.input-code{width:100%;padding:.9rem 1.5rem;border-radius:9999px;border:1px solid rgba(45,212,191,.25);background:rgba(4,18,16,.6);color:#e7f5f3;font-size:.9rem;letter-spacing:.18em;text-align:center;box-shadow:inset 0 0 14px rgba(45,212,191,.06);transition:border-color .3s ease,box-shadow .3s ease}.input-code::-moz-placeholder{color:rgba(161,196,191,.45);text-transform:uppercase;font-size:.78rem;letter-spacing:.22em}.input-code::placeholder{color:rgba(161,196,191,.45);text-transform:uppercase;font-size:.78rem;letter-spacing:.22em}.input-code:focus{outline:none;border-color:rgba(94,234,212,.6);box-shadow:0 0 22px rgba(45,212,191,.18),inset 0 0 14px rgba(45,212,191,.1)}.input-code:focus-visible{outline:2px solid rgba(94,234,212,.9);outline-offset:3px}.btn-start{display:inline-flex;align-items:center;justify-content:center;width:100%;padding:.9rem 2.75rem;border-radius:9999px;border:1px solid rgba(45,212,191,.45);background:linear-gradient(180deg,rgba(8,60,54,.55),rgba(4,24,22,.55));color:#9cf3e6;font-size:.8rem;font-weight:600;letter-spacing:.28em;text-transform:uppercase;backdrop-filter:blur(4px);box-shadow:0 0 22px rgba(45,212,191,.22),inset 0 0 14px rgba(45,212,191,.1);transition:box-shadow .3s ease,border-color .3s ease,color .3s ease,transform .3s ease}.btn-start:hover{border-color:rgba(94,234,212,.8);color:#eafffb;box-shadow:0 0 38px rgba(45,212,191,.4),inset 0 0 18px rgba(45,212,191,.18);transform:translateY(-1px)}.btn-start:focus-visible{outline:2px solid rgba(94,234,212,.9);outline-offset:4px}.btn-start:active{transform:translateY(0);box-shadow:0 0 26px rgba(45,212,191,.3),inset 0 0 14px rgba(45,212,191,.14)}.btn-start:disabled{cursor:wait;opacity:.65;transform:none}@media (prefers-reduced-motion:reduce){.btn-start,.input-code{transition:none}.btn-start:hover{transform:none}}