/* WEB PANEL PROXY public CSS */
:root{color-scheme:dark;--bg:#0b1020;--text:#f0f4ff;--muted:#9caac6;--gold:#f3c783;--cyan:#83e1e8}
*{box-sizing:border-box}html,body{margin:0;min-height:100%}body{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--text);background:radial-gradient(ellipse at 50% 110%,#153b57 0%,transparent 54%),radial-gradient(ellipse at 50% 5%,#212344 0%,transparent 54%),var(--bg);min-height:100svh;display:grid;place-items:center;padding:32px 16px;overflow-x:hidden}
.ambient{position:fixed;inset:0;pointer-events:none;background-image:radial-gradient(#ffffff60 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(to bottom,#0004,transparent 90%);opacity:.22}
.shell{position:relative;z-index:1;max-width:720px;width:100%;text-align:center;padding:35px 24px 28px;border:1px solid #ffffff16;border-radius:32px;background:linear-gradient(145deg,#ffffff0d,#ffffff03);box-shadow:0 30px 90px #0007;backdrop-filter:blur(14px)}
.eyebrow{color:var(--cyan);font-size:12px;font-weight:800;letter-spacing:.33em;text-transform:uppercase}.title{font-size:clamp(42px,10vw,72px);line-height:1.05;letter-spacing:-.065em;margin:12px 0 8px;font-weight:900}.title span{color:var(--gold)}.lead{color:var(--muted);font-size:clamp(15px,3vw,18px);line-height:1.6;margin:0 auto 10px;max-width:520px}
.scene{position:relative;width:min(360px,90%);height:300px;margin:5px auto 0;perspective:900px;display:flex;align-items:flex-end;justify-content:center}.halo{position:absolute;bottom:17px;left:50%;transform:translateX(-50%);width:275px;height:245px;border-radius:50%;background:#e8b87524;filter:blur(47px);transition:background .6s}.frame{position:relative;width:166px;height:252px;border:9px solid #d2a66a;border-bottom-width:10px;border-radius:88px 88px 2px 2px;box-shadow:0 0 0 3px #4a3c46,0 0 38px #f6c17a52,inset 0 0 20px #f9d69a91;overflow:visible;background:linear-gradient(160deg,#89a9d0 0%,#5267a4 35%,#d3a7a2 70%,#ffcf8a 100%)}
.frame:after{content:"";position:absolute;z-index:0;left:50%;bottom:0;transform:translateX(-50%);width:68px;height:130px;background:linear-gradient(to top,#fff2c9aa,transparent);filter:blur(16px)}.door{position:absolute;z-index:2;inset:0;transform-origin:left center;transform-style:preserve-3d;transition:transform 1.15s cubic-bezier(.2,.75,.2,1);border-radius:77px 77px 0 0;border:3px solid #664b45;background:repeating-linear-gradient(90deg,transparent 0,transparent 25px,#ffffff06 26px,#ffffff06 27px),linear-gradient(105deg,#875a4d,#503b48 50%,#392c3f);box-shadow:inset -8px 0 18px #0006,5px 0 17px #0007}.door:before{content:"";position:absolute;inset:30px 18px 33px;border:2px solid #d0a16b55;border-radius:60px 60px 3px 3px}.knob{position:absolute;right:15px;top:56%;width:11px;height:11px;background:radial-gradient(circle at 30% 30%,#fff5cc,#dfab58 55%,#79502e);border-radius:50%;box-shadow:0 0 8px #ffc9798f}.floor{position:absolute;bottom:0;width:300px;height:35px;background:radial-gradient(ellipse,#edbd7663,transparent 70%);filter:blur(8px)}.scene.open .door{transform:rotateY(-72deg)}.scene.open .halo{background:#82c9e54a}
.status{display:inline-flex;gap:9px;align-items:center;color:#c6d3e7;border:1px solid #ffffff1c;padding:9px 16px;border-radius:99px;background:#ffffff09;font-size:13px}.dot{width:7px;height:7px;border-radius:50%;background:#6ee7b7;box-shadow:0 0 12px #6ee7b7;animation:pulse 1.6s infinite}.message{min-height:28px;margin:18px 0;color:var(--muted);font-size:15px}.action{border:0;border-radius:100px;background:linear-gradient(130deg,#f8d79e,#e9af65);color:#241b22;font:800 16px inherit;font-size:16px;font-weight:800;padding:15px 26px;cursor:pointer;box-shadow:0 9px 28px #e5aa6338;transition:transform .2s,box-shadow .2s}.action:hover{transform:translateY(-2px);box-shadow:0 12px 32px #e5aa6360}.action:focus-visible{outline:3px solid var(--cyan);outline-offset:4px}.foot{margin-top:25px;color:#76849e;font-size:12px;letter-spacing:.06em}@keyframes pulse{50%{opacity:.4;transform:scale(.75)}}@media(max-width:480px){.shell{padding:28px 16px 23px;border-radius:24px}.scene{height:275px}.frame{transform:scale(.9);transform-origin:bottom center}.lead{max-width:310px}.foot{margin-top:20px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}