*{box-sizing:border-box}body{margin:0;background:#1a1410;color:#ccc;font-family:Courier New,Courier,monospace;background-image:radial-gradient(ellipse at 50% 0%,#2a2018,#1a1410 70%);min-height:100vh}.app{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:24px}.crt-tv{display:flex;flex-direction:column;align-items:center}.crt-body{display:flex;flex-direction:column;background:linear-gradient(10deg,#5c3a1e,#7a5230,#6b4424,#8a6038,#6b4424,#7a5230,#5c3a1e,#7a5230,#6b4424,#8a6038,#6b4424,#5c3a1e,#7a5230 96%,#6b4424);border-radius:14px;padding:28px;gap:16px;border:3px solid #3a2210;box-shadow:0 8px 40px #000000b3,0 2px 10px #00000080,inset 0 1px #ffffff14,inset 0 -2px 4px #0000004d;position:relative}.crt-body:before{content:"";position:absolute;inset:0;border-radius:14px;background:repeating-linear-gradient(95deg,transparent 0px,transparent 2px,rgba(0,0,0,.04) 2px,rgba(0,0,0,.04) 4px);pointer-events:none}.crt-screen-frame{background:#1a1a1a;border-radius:20px;padding:12px;box-shadow:inset 0 3px 8px #000c,inset 0 0 2px #000000e6,0 1px #ffffff0d;border:2px solid #111}.crt-screen{position:relative;overflow:hidden;border-radius:12px;box-shadow:0 0 40px #00ff6414,0 0 80px #00ff640a,inset 0 0 30px #0006;background:#000;animation:flicker .15s infinite alternate}.teletext-screen svg{display:block;width:640px;height:400px}.crt-overlay{position:absolute;inset:0;border-radius:12px;pointer-events:none;z-index:10;background:repeating-linear-gradient(0deg,transparent 0px,transparent 1px,rgba(0,0,0,.25) 1px,rgba(0,0,0,.25) 2px),radial-gradient(ellipse at 50% 50%,transparent 55%,rgba(0,0,0,.35) 80%,rgba(0,0,0,.7) 100%),linear-gradient(135deg,rgba(255,255,255,.05) 0%,rgba(255,255,255,.02) 30%,transparent 50%,transparent 100%)}.crt-overlay:after{content:"";position:absolute;inset:0;border-radius:12px;pointer-events:none;background:linear-gradient(0deg,transparent 0%,rgba(255,255,255,.015) 50%,transparent 100%);background-size:100% 8px;animation:scanline-scroll 8s linear infinite;opacity:.6}.crt-power{width:28px;height:28px;border-radius:50%;border:2px solid #2a1a0e;cursor:pointer;background:radial-gradient(ellipse at 40% 35%,#444,#2a2a2a,#181818);box-shadow:0 2px 4px #0009,0 1px #ffffff0f,inset 0 -1px 2px #0006;position:relative;transition:box-shadow .2s ease}.crt-power:before{content:"";position:absolute;top:50%;left:50%;width:10px;height:10px;border:2px solid #666;border-radius:50%;transform:translate(-50%,-50%);clip-path:polygon(0% 20%,0% 100%,100% 100%,100% 20%,60% 20%,60% 0%,40% 0%,40% 20%)}.crt-power:after{content:"";position:absolute;top:4px;left:50%;transform:translate(-50%);width:2px;height:7px;background:#666;border-radius:1px}.crt-power.on:before{border-color:#c11}.crt-power.on:after{background:#c11;box-shadow:0 0 4px #00ff0080}.crt-power:hover{box-shadow:0 2px 4px #0009,0 1px #ffffff0f,inset 0 -1px 2px #0006,0 0 8px #00ff0026}.crt-screen.off{animation:power-off .5s ease-in forwards}.crt-screen.off .crt-overlay{opacity:0}@keyframes power-off{0%{filter:brightness(1) saturate(1);transform:scaleY(1) scaleX(1)}40%{filter:brightness(1.5) saturate(.5);transform:scaleY(.005) scaleX(1)}70%{filter:brightness(1.2) saturate(0);transform:scaleY(.005) scaleX(.1)}to{filter:brightness(0) saturate(0);transform:scaleY(.005) scaleX(0)}}.crt-panel{display:flex;flex-direction:row;align-items:center;padding:4px 8px;gap:16px}.crt-panel-right{display:flex;flex-direction:row;align-items:center;gap:16px;margin-left:auto}.crt-knobs{display:flex;flex-direction:row;align-items:center;gap:12px}.crt-knob{width:36px;height:36px;border-radius:50%;border:2px solid #2a1a0e;cursor:pointer;background:radial-gradient(ellipse at 40% 35%,#555,#3a3a3a,#222 80%,#111);box-shadow:0 2px 4px #0009,0 1px #ffffff14,inset 0 -1px 2px #0006;position:relative;transition:transform .15s ease}.crt-knob:after{content:"";position:absolute;top:4px;left:50%;transform:translate(-50%);width:2px;height:8px;background:#888;border-radius:1px}.crt-knob:hover{transform:rotate(15deg)}.crt-knob.active{transform:rotate(90deg);background:radial-gradient(ellipse at 40% 35%,#666,#444,#2a2a2a 80%,#1a1a1a)}.crt-knob.active:after{background:#a00;box-shadow:0 0 4px #00ff0080}.crt-indicator{width:10px;height:10px;border-radius:50%;background:#3a0a0a;border:1px solid #2a1a0e;box-shadow:inset 0 1px 2px #00000080;transition:all .3s ease}.crt-indicator.on{background:#0f0;box-shadow:0 0 6px #0f09,0 0 12px #00ff004d,inset 0 0 2px #ffffff4d}.crt-channel-label{font-family:Georgia,Times New Roman,serif;font-size:9px;letter-spacing:2px;color:#8a7040;text-shadow:0 1px 1px rgba(0,0,0,.5);-webkit-user-select:none;user-select:none;margin-bottom:8px}@keyframes flicker{0%{filter:brightness(1)}25%{filter:brightness(.985)}50%{filter:brightness(1.01)}75%{filter:brightness(.99)}to{filter:brightness(1.005)}}@keyframes scanline-scroll{0%{background-position:0 -100%}to{background-position:0 200%}}.crt-screen{animation:flicker .15s infinite alternate,power-on 1.5s ease-out 1}@keyframes power-on{0%{filter:brightness(0) saturate(0);transform:scaleY(.005)}30%{filter:brightness(1.5) saturate(.5);transform:scaleY(.005)}50%{filter:brightness(1.2) saturate(.7);transform:scaleY(1.1)}70%{filter:brightness(1.1) saturate(.9);transform:scaleY(.98)}to{filter:brightness(1) saturate(1);transform:scaleY(1)}}