/* 생성일자: 2026-09-07 | Neon architectural lighting */
:root{--bg:#060812;--fg:#f2f3ff;--muted:#b0b3ce;--cyan:#68e8f6;--line:#b2baff24}
body{background:radial-gradient(ellipse at 2% 10%,#43208032,transparent 37%),radial-gradient(ellipse at 98% 28%,#105d7023,transparent 42%),linear-gradient(160deg,#070917,#090a13 50%,#080a17)}
body:before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(110deg,transparent 20%,#a56aff05 45%,transparent 60%),repeating-linear-gradient(90deg,transparent 0 159px,#929eff04 160px);opacity:.85}
.site-header{position:relative;background:linear-gradient(100deg,#0d0c21ee,#090e1cee 60%,#0d1324ee);border-bottom-color:#8aa4ff30;box-shadow:0 12px 45px #0003,inset 0 -1px #c4c8ff0a}
.site-header:after{content:"";position:absolute;bottom:-1px;left:4vw;width:92vw;height:1px;background:linear-gradient(90deg,transparent,#af78ff80 30%,#6cefff80 70%,transparent);pointer-events:none}
.brand{color:#ececff;text-shadow:0 0 24px #ad83ff4d}.brand span{color:#a9b5d1;text-shadow:none}
.site-header nav a{position:relative;transition:color .25s}.site-header nav a:hover{color:var(--cyan)}.site-header nav .current{color:#d7ceff;text-shadow:0 0 16px #a66aff66}.site-header nav .current:after{content:"";position:absolute;bottom:-12px;left:20%;right:20%;height:2px;background:var(--accent);box-shadow:0 0 10px var(--accent)}
.intro{position:relative}.intro:after{content:"";position:absolute;right:0;bottom:20px;width:190px;height:1px;background:linear-gradient(90deg,transparent,#6ee1ef4d);transform:rotate(-28deg);transform-origin:right;pointer-events:none}
h1{color:#e6e9fa;text-shadow:0 4px 28px #060711}h1 em{color:#d4c3ff;text-shadow:0 0 35px rgba(var(--glow),.28)}.intro .eyebrow{color:#aaaacb}.intro-note{border-left:1px solid #8c8de63b;padding-left:20px}
.toolbar{padding:12px 14px;margin:0 0 16px;border:1px solid #c7bfff20;border-radius:12px;background:linear-gradient(115deg,#19172a9e,#0d14229e);box-shadow:inset 0 1px #ffffff08,0 10px 30px #0002}
.filters{scrollbar-color:#675788 #111324}.filters button{border-radius:6px;min-height:40px;color:#b7b7cc;transition:background .25s,color .25s,border-color .25s,box-shadow .25s}.filters button:hover{border-color:#b8a0ee4a;background:#c0acff0a}.filters button[aria-pressed=true]{border-color:rgba(var(--glow),.64);background:linear-gradient(145deg,rgba(var(--glow),.23),rgba(var(--glow),.07));color:#f4efff;box-shadow:inset 0 1px #ffffff18,0 0 19px rgba(var(--glow),.09)}
.view-switch{background:#070c18;box-shadow:inset 0 2px 5px #0009;border-color:#a5b5e82a;border-radius:7px}.view-switch button[aria-pressed=true]{background:linear-gradient(145deg,#e3d9ff,#9dd8eb);box-shadow:0 0 16px #aeafff2e;color:#101426;border-radius:4px;font-weight:500}
.space{border:1px solid #bfa7fb45;border-radius:16px;background:radial-gradient(ellipse at 50% 33%,rgba(var(--glow),.2),transparent 52%),radial-gradient(ellipse at 7% 55%,#17647833,transparent 36%),radial-gradient(ellipse at 95% 50%,#612a9133,transparent 36%),linear-gradient(180deg,#101027,#080c18 66%,#111426);box-shadow:0 35px 80px #0007,0 0 55px rgba(var(--glow),.08),inset 0 0 90px #0006;--camera-x:0deg;--camera-y:0deg}
.space:before{content:"";position:absolute;inset:0;z-index:4;pointer-events:none;border-radius:inherit;background:linear-gradient(90deg,var(--cyan),transparent) 22px 17px/43px 1px no-repeat,linear-gradient(var(--cyan),transparent) 17px 22px/1px 43px no-repeat,linear-gradient(270deg,var(--accent),transparent) calc(100% - 22px) calc(100% - 17px)/43px 1px no-repeat,linear-gradient(0deg,var(--accent),transparent) calc(100% - 17px) calc(100% - 22px)/1px 43px no-repeat;opacity:.72}
.space:after{box-shadow:inset 55px 0 85px -65px #02040a,inset -55px 0 85px -65px #02040a,inset 0 0 0 5px #ffffff02}
.architecture{position:absolute;inset:0;pointer-events:none;perspective:850px;perspective-origin:50% 45%;transform-style:preserve-3d;transform:rotateX(var(--camera-x)) rotateY(var(--camera-y));transition:transform .7s ease}
.portal{position:absolute;top:8%;left:8%;width:84%;height:88%;border:1px solid rgba(var(--glow),.44);border-top:2px solid rgba(var(--glow),.65);border-radius:28px 28px 3px 3px;box-shadow:0 0 13px rgba(var(--glow),.14),inset 0 0 13px rgba(var(--glow),.1);background:linear-gradient(90deg,#9b7bf908,transparent 5% 95%,#4ed8f808);transform:translateZ(var(--z));opacity:var(--opacity)}
.portal-1{--z:70px;--opacity:.65}.portal-2{--z:-140px;--opacity:.58}.portal-3{--z:-370px;--opacity:.43}.portal-4{--z:-650px;--opacity:.35}
.ceiling-plane{position:absolute;top:-140px;left:-10%;width:120%;height:300px;transform:rotateX(-70deg);transform-origin:50% 100%;background:repeating-linear-gradient(90deg,transparent 0 23.9%,rgba(var(--glow),.14) 24% 24.15%,transparent 24.3% 25%),linear-gradient(0deg,rgba(var(--glow),.09),transparent);border-bottom:1px solid rgba(var(--glow),.2)}
.light-column{position:absolute;top:12%;height:66%;width:2px;opacity:.8;background:linear-gradient(transparent,var(--cyan),transparent);box-shadow:0 0 12px #5ee4ff7a,0 0 35px #5ee4ff40}.column-left{left:6%;transform:rotate(4deg)}.column-right{right:6%;transform:rotate(-4deg);background:linear-gradient(transparent,var(--accent),transparent);box-shadow:0 0 12px rgba(var(--glow),.65),0 0 35px rgba(var(--glow),.35)}
.room-word{top:6%;color:rgba(var(--glow),.045);text-shadow:0 0 60px rgba(var(--glow),.08);letter-spacing:.12em}.room-label{top:26px;left:30px;color:#bec4e0;letter-spacing:.16em;text-shadow:0 0 12px #060811;background:#090c1780;padding:5px 8px;border-left:2px solid var(--cyan)}
.room-light{top:3px;left:22%;width:56%;height:2px;background:linear-gradient(90deg,transparent,#cfbcff,var(--cyan),transparent);box-shadow:0 0 28px 3px rgba(var(--glow),.25)}
.floor{height:400px;bottom:-215px;left:-40%;width:180%;transform:perspective(540px) rotateX(65deg);transform-origin:50% 30%;background:repeating-linear-gradient(90deg,transparent 0 119px,rgba(var(--glow),.17) 120px 121px),repeating-linear-gradient(0deg,transparent 0 64px,rgba(var(--glow),.13) 65px 66px),radial-gradient(ellipse at 50% 20%,rgba(var(--glow),.14),#0a102000 66%);border-top-color:#adbcfa21;mask-image:linear-gradient(transparent,#000 20%,#000 70%,transparent)}
.floor-glow{position:absolute;bottom:15px;left:20%;width:60%;height:90px;background:radial-gradient(ellipse,rgba(var(--glow),.23),transparent 67%);transform:scaleY(.5);filter:blur(14px);pointer-events:none}
.art-frame{background:linear-gradient(130deg,#a9a3c8,#3d3855 12%,#141a2a 45%,#14121f 80%,#a8baca);border-color:#c8c2ed66;box-shadow:0 28px 45px #000b,inset 0 0 0 1px #ffffff1a;filter:brightness(.72);-webkit-box-reflect:below 28px linear-gradient(transparent 66%,#ffffff13)}
.art-frame[data-active=true]{border-color:rgba(var(--glow),.88);box-shadow:0 25px 55px #000b,0 0 0 1px rgba(var(--glow),.2),0 0 24px rgba(var(--glow),.14),inset 0 0 0 1px #ffffff20}.art-frame .frame-number{color:#d9d6eb;text-shadow:0 0 12px var(--accent)}.art-frame:after{background:linear-gradient(120deg,#ffffff0b,transparent 20% 85%,#acb9ff08)}
.round{border-color:rgba(var(--glow),.52);background:linear-gradient(145deg,#25223ddb,#0a1021ed);box-shadow:0 6px 20px #0006,inset 0 1px #ffffff17;color:#eeeaff;transition:transform .25s,box-shadow .25s,border-color .25s}.round:hover{transform:translateY(-2px);box-shadow:0 8px 25px #0006,0 0 22px rgba(var(--glow),.25);border-color:var(--cyan)}.round:active{transform:translateY(1px)}.gesture{color:#c3c7df;text-shadow:0 2px 10px #000}
.work-info{margin-top:15px;padding:22px 24px;background:linear-gradient(100deg,rgba(var(--glow),.1),#121a2b80);border:1px solid rgba(var(--glow),.2);border-radius:10px;box-shadow:inset 0 1px #ffffff05}
.work-heading h2{text-shadow:0 0 25px rgba(var(--glow),.12)}.text-button{border:1px solid rgba(var(--glow),.4);border-radius:6px;padding:10px 15px;background:rgba(var(--glow),.09);color:#eeeaff;transition:background .25s,box-shadow .25s}.text-button:hover{background:rgba(var(--glow),.2);box-shadow:0 0 20px rgba(var(--glow),.12)}
.filmstrip{margin-top:13px;padding:10px 8px 17px;scrollbar-color:rgba(var(--glow),.5) transparent}.thumb{border-radius:5px;background:#14162a55;opacity:.65}.thumb img{border-radius:2px}.thumb[aria-pressed=true]{background:rgba(var(--glow),.12);box-shadow:0 0 14px rgba(var(--glow),.16)}
.tile-art{border-color:#b0a0ed25;border-radius:9px;background:radial-gradient(ellipse at 50% 20%,rgba(var(--glow),.16),#101322 70%);box-shadow:inset 0 1px #ffffff08,0 12px 30px #0003;transition:border-color .3s,box-shadow .3s}.tile:hover .tile-art{border-color:rgba(var(--glow),.6);box-shadow:0 0 25px rgba(var(--glow),.1),0 16px 35px #0005}.tile-index{color:var(--accent)}
.cinema{position:relative;border-top-color:#9388e236;background:radial-gradient(ellipse at 78% 40%,#3420653b,transparent 60%),linear-gradient(135deg,#10112288,#080b17);box-shadow:inset 0 1px #ffffff04}.cinema:before{content:"";position:absolute;top:-1px;left:20%;right:20%;height:1px;background:linear-gradient(90deg,transparent,var(--accent),var(--cyan),transparent);opacity:.55}.cinema h2 em{color:#ccbaff;text-shadow:0 0 28px #996bff26}.cinema a{color:var(--cyan);border-color:#66e9fb66}
.screen-top{border-color:#a093d842;border-radius:10px 10px 0 0;background:linear-gradient(100deg,#251d38,#111c2e);box-shadow:inset 0 1px #ffffff0c}.watch-player{border-color:#a093d842;box-shadow:0 25px 60px #0007,0 0 28px #a079f714}.screen>p{color:#aab1cf}
footer{background:linear-gradient(100deg,#0e0d1c,#0a101b);border-top-color:#9997d524}
dialog{background:radial-gradient(ellipse at 50% 40%,rgba(var(--glow),.1),transparent 65%),#070b13fa}.dialog-top{border-bottom:1px solid rgba(var(--glow),.16);background:#0d102088}.dialog-info{border-top:1px solid rgba(var(--glow),.16);margin-top:12px}.viewer img{filter:drop-shadow(0 20px 40px #000b)}.viewer .round{box-shadow:0 0 18px rgba(var(--glow),.12)}
@media(max-width:1000px){.toolbar{padding:10px}.view-switch{margin-left:2px}.intro:after{display:none}}
@media(max-width:640px){.intro-note{padding-left:12px}.toolbar{margin-bottom:12px;border-radius:9px}.space{border-radius:12px}.room-label{top:22px;left:24px;font-size:8px;letter-spacing:.08em}.portal{left:4%;width:92%;top:10%;height:85%;border-radius:18px 18px 3px 3px}.light-column{opacity:.5}.floor{height:340px;bottom:-190px}.floor-glow{left:0;width:100%;bottom:12px}.art-frame{-webkit-box-reflect:none}.work-info{padding:17px 14px}.work-heading h2{font-size:17px}.work-actions{max-width:120px}.text-button{padding:8px 10px;font-size:11px}.work-heading .eyebrow{font-size:9px}.filmstrip{padding-left:0;padding-right:0}.cinema{margin-top:28px}}
@media(prefers-reduced-motion:reduce){.architecture{transform:none!important}.round:hover,.round:active{transform:none}.art-frame{-webkit-box-reflect:none}}
@media(max-width:640px){.site-header nav>a:first-child{display:inline}.site-header nav{gap:12px}.site-header nav button{padding-left:10px}}