:root{--bg-primary: #04070f;--bg-secondary: #081222;--bg-glass: rgba(10, 16, 28, .72);--bg-glass-strong: rgba(11, 18, 32, .85);--surface-outline: rgba(255, 255, 255, .08);--surface-highlight: rgba(147, 224, 255, .18);--accent-color: #5be3ff;--accent-strong: #0ea3ff;--text-primary: #f5f5f7;--text-secondary: rgba(245, 245, 247, .7);--shadow-soft: 0 32px 120px rgba(2, 6, 18, .65);--radius-large: 36px;--radius-medium: 22px;--radius-pill: 999px;--transition-speed: .35s;--font-body: "SF Pro Display", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-size-small: clamp(12px, .85rem, 14px);--font-size-body: clamp(16px, 1.15vw, 18px);--content-max-width: min(1200px, 100%)}*{margin:0;padding:0;box-sizing:border-box}html{height:100%;width:100%;background-color:var(--bg-primary)}body{min-height:100%;width:100%;background:radial-gradient(160% 120% at 10% 20%,#1c4a7859,#070c1600 48%),radial-gradient(120% 120% at 85% 10%,#3471d459,#070c1600 52%),var(--bg-primary);color:var(--text-primary);font-family:var(--font-body);line-height:1.65;-webkit-font-smoothing:antialiased;padding:clamp(24px,4vw,64px);display:flex;flex-direction:column;align-items:center;overflow-x:hidden;position:relative;isolation:isolate;gap:clamp(32px,6vh,64px)}button,input,textarea,select{font:inherit;color:inherit}a{color:var(--accent-color);text-decoration:none;transition:color var(--transition-speed) ease}a:hover,a:focus-visible{color:var(--text-primary)}@supports (padding: max(0px)){body{padding-top:max(env(safe-area-inset-top),clamp(24px,4vw,64px));padding-right:max(env(safe-area-inset-right),clamp(24px,4vw,64px));padding-bottom:max(env(safe-area-inset-bottom),clamp(24px,4vw,64px));padding-left:max(env(safe-area-inset-left),clamp(24px,4vw,64px))}}.app__background{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}.app__glow{position:absolute;width:clamp(320px,40vw,600px);height:clamp(320px,45vw,680px);border-radius:50%;filter:blur(140px);opacity:.55;transform:translateZ(0);transition:opacity var(--transition-speed) ease}.app__glow--left{background:radial-gradient(circle at center,rgba(91,227,255,.45),transparent 65%);top:-12%;left:-8%}.app__glow--right{background:radial-gradient(circle at center,rgba(14,163,255,.45),transparent 65%);bottom:-18%;right:-6%}.layout{width:min(calc(var(--content-max-width) + 180px),92vw);display:grid;grid-template-columns:minmax(320px,1.05fr) minmax(420px,1.2fr);gap:clamp(36px,6vw,120px);align-items:stretch;position:relative;z-index:1}.presentation{position:relative;border-radius:var(--radius-large);background:var(--bg-glass);border:1px solid var(--surface-outline);box-shadow:var(--shadow-soft);padding:clamp(28px,4vw,48px);overflow:hidden;transition:transform var(--transition-speed) ease,box-shadow var(--transition-speed) ease;display:flex;align-items:flex-end}.presentation:before{content:"";position:absolute;inset:0;background:linear-gradient(140deg,#5be3ff29,#5be3ff00);opacity:.75;pointer-events:none}.presentation:hover{transform:translateY(-6px);box-shadow:0 40px 120px #040c1e8c}.presentation__inner{position:relative;z-index:1;display:flex;flex-direction:column;gap:clamp(18px,2vw,28px);font-size:clamp(18px,1.25vw,22px);max-width:clamp(480px,42vw,620px)}.presentation p{color:var(--text-secondary)}.presentation p:first-of-type{color:var(--text-primary);font-size:clamp(24px,1.9vw,30px);letter-spacing:.01em}.presentation a{position:relative;color:var(--accent-color)}.presentation a:after{content:"";position:absolute;left:0;bottom:-2px;width:100%;height:1px;background:linear-gradient(90deg,transparent,var(--accent-color),transparent);opacity:.35;transition:opacity var(--transition-speed) ease}.presentation a:hover:after,.presentation a:focus-visible:after{opacity:.85}.scene-container{position:relative;border-radius:var(--radius-large);background:var(--bg-glass-strong);border:1px solid var(--surface-outline);overflow:hidden;box-shadow:var(--shadow-soft);transition:transform var(--transition-speed) ease,box-shadow var(--transition-speed) ease;display:flex}.scene-container:hover{transform:translateY(-6px);box-shadow:0 42px 140px #040c1e99}.scene-frame{position:relative;flex:1;border-radius:inherit;overflow:hidden;min-height:clamp(360px,58vh,720px);background:radial-gradient(120% 120% at 50% 20%,#4a90e229,#060e1ceb 55%),radial-gradient(120% 140% at 50% 120%,#5be3ff2e,#0a101cf2 56%)}.scene-frame:after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:120px 120px;mix-blend-mode:screen;opacity:.3;pointer-events:none}.scene{width:100%;height:100%;display:block}.shader-selector-container{position:fixed;left:50%;bottom:clamp(24px,4vw,48px);transform:translate(-50%);z-index:4}.shader-selector{display:inline-flex;gap:clamp(6px,1vw,14px);padding:clamp(10px,1.6vw,14px);border-radius:var(--radius-pill);border:1px solid var(--surface-outline);background:#070c16cc;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);box-shadow:0 22px 60px #040c1e73}.shader-selector__item{position:relative;border:1px solid rgba(255,255,255,.08);border-radius:var(--radius-pill);padding:clamp(9px,1.6vw,13px) clamp(20px,3.4vw,32px);padding-left:clamp(62px,8vw,86px);background:#09111e8c;color:var(--text-secondary);cursor:pointer;transition:all var(--transition-speed) ease;display:flex;align-items:center;gap:clamp(14px,2.2vw,20px);min-width:clamp(160px,24vw,220px)}.shader-selector__item:before{content:"";position:absolute;inset:0;border-radius:inherit;border:1px solid transparent;background:linear-gradient(145deg,#ffffff14,#ffffff05);mask:linear-gradient(#fff,#fff) content-box,linear-gradient(#fff,#fff);-webkit-mask-composite:xor;mask-composite:exclude;padding:1px;opacity:0;transition:opacity var(--transition-speed) ease}.shader-selector__item:focus-visible{outline:none;box-shadow:0 0 0 3px #5be3ff59}.shader-selector__item:hover{color:var(--text-primary)}.shader-selector__item:hover:before{opacity:1}.shader-selector__icon{position:absolute;left:clamp(18px,3vw,30px);width:clamp(28px,3.8vw,40px);height:clamp(28px,3.8vw,40px);display:inline-flex;align-items:center;justify-content:center;border-radius:50%;background:#ffffff0f;box-shadow:inset 0 0 0 1px #ffffff0f;overflow:hidden;transition:transform var(--transition-speed) ease,box-shadow var(--transition-speed) ease}.shader-selector__icon img{width:100%;height:100%;object-fit:contain;display:block}.shader-selector__label{font-size:var(--font-size-small);letter-spacing:.04em;text-transform:uppercase;white-space:nowrap}.shader-selector__item.is-active{color:var(--bg-primary);background:linear-gradient(135deg,var(--accent-color),var(--accent-strong));border-color:transparent;box-shadow:0 18px 45px #0ea3ff59;transform:translateY(-2px)}.shader-selector__item.is-active .shader-selector__icon{transform:scale(1.05);box-shadow:0 0 0 1px #0c182659,0 0 24px #0ea3ff52}@media screen and (max-width:1140px){.layout{grid-template-columns:1fr;width:min(900px,94vw);gap:clamp(32px,8vw,48px)}.scene-frame{min-height:clamp(420px,60vh,680px)}.presentation{justify-content:center}.presentation__inner{max-width:min(620px,88vw)}}@media screen and (max-width:820px){.presentation{padding:clamp(24px,6vw,40px)}.presentation__inner{font-size:clamp(19px,2.1vw,22px);gap:clamp(16px,4vw,24px);max-width:min(540px,92vw)}}@media screen and (max-width:920px){body{padding:clamp(20px,5vw,40px)}.shader-selector-container{position:static;transform:none;width:100%;display:flex;justify-content:center}.shader-selector{width:min(100%,600px);flex-wrap:wrap;justify-content:center;gap:10px}.shader-selector__item{min-width:calc(50% - 10px);justify-content:flex-start;padding-left:clamp(56px,10vw,74px)}}@media screen and (max-width:620px){.layout{gap:clamp(24px,6vw,32px)}.presentation{padding:clamp(26px,8vw,40px)}.scene-frame{min-height:clamp(340px,58vh,560px)}.shader-selector{width:100%}.shader-selector__item{min-width:100%;padding-left:clamp(62px,18vw,88px)}.presentation__inner{max-width:none;font-size:clamp(20px,5vw,24px);line-height:1.75}.presentation p:first-of-type{font-size:clamp(26px,7vw,32px)}}