@import "https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;1,300;1,400&family=DM+Sans:wght@300;400;500&display=swap";:root{--text-primary:#f0ece4;--text-secondary:#f0ece499;--text-dim:#f0ece459;--accent:#c9a96e;--accent-dim:#c9a96e66}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;color:var(--text-primary);cursor:default;-webkit-font-smoothing:antialiased;background:#0c0a09;font-family:DM Sans,sans-serif;overflow:hidden}#canvas{z-index:0;position:fixed;inset:0}#canvas img{object-fit:contain;opacity:0;width:100%;height:100%;transition:opacity 1.6s cubic-bezier(.22,1,.36,1);position:absolute;inset:0}#canvas img.visible{opacity:1}#canvas:after{content:"";pointer-events:none;z-index:1;background:radial-gradient(#0000 40%,#0c0a0980 100%),linear-gradient(#0000 65%,#0c0a09b3 100%),linear-gradient(#0c0a094d 0%,#0000 15%);position:absolute;inset:0}#ui{z-index:2;flex-direction:column;justify-content:space-between;padding:2.5rem 3rem;display:flex;position:fixed;inset:0}.top-bar{justify-content:space-between;align-items:flex-start;display:flex}.credit{opacity:0;animation:.8s .3s forwards fadeUp}.credit a{text-decoration:none;transition:color .3s}.credit-title{letter-spacing:.06em;text-shadow:0 1px 8px #00000080;font-family:Cormorant Garamond,serif;font-size:1.1rem;font-weight:300}.credit-title a{color:var(--text-secondary)}.credit-title a:hover{color:var(--text-primary)}.credit-sub{letter-spacing:.08em;color:var(--text-dim);margin-top:.15rem;font-size:.55rem}.credit-sub a{color:var(--text-dim)}.credit-sub a:hover{color:var(--text-secondary)}.bottom{justify-content:space-between;align-items:flex-end;display:flex}.artwork-info{opacity:0;max-width:560px;transition:all .8s cubic-bezier(.22,1,.36,1);transform:translateY(12px)}.artwork-info.visible{opacity:1;transform:translateY(0)}.artwork-info .artist{letter-spacing:.2em;text-transform:uppercase;color:var(--accent);text-shadow:0 1px 6px #00000080;margin-bottom:.5rem;font-family:DM Sans,sans-serif;font-size:.65rem;font-weight:500}.artwork-info .title{color:var(--text-primary);text-shadow:0 2px 12px #00000080;margin-bottom:.4rem;font-family:Cormorant Garamond,serif;font-size:2rem;font-style:italic;font-weight:300;line-height:1.2}.artwork-info .meta{color:var(--text-secondary);letter-spacing:.03em;text-shadow:0 1px 6px #00000080;font-size:.72rem;font-weight:300}.artwork-info .museum{letter-spacing:.12em;text-transform:uppercase;color:var(--text-dim);text-shadow:0 1px 6px #00000080;margin-top:.8rem;font-size:.6rem;font-weight:400}.source-link{letter-spacing:.1em;color:var(--text-dim);cursor:pointer;border-bottom:1px solid #f0ece41a;padding-bottom:1px;font-size:.6rem;text-decoration:none;transition:all .3s}.source-link:hover{color:var(--text-secondary);border-color:#f0ece44d}.nav-buttons{gap:.4rem;display:flex}.nav-hint{opacity:0;flex-direction:column;align-items:flex-end;gap:.6rem;animation:.8s .7s forwards fadeUp;display:flex}.nav-btn{cursor:pointer;-webkit-backdrop-filter:blur(10px);background:#f0ece40f;border:1px solid #f0ece414;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;transition:all .3s;display:flex}.nav-btn:hover{background:#f0ece424;border-color:#f0ece433}.nav-btn svg{width:16px;height:16px;stroke:var(--text-secondary);fill:none;stroke-width:1.5px;stroke-linecap:round;stroke-linejoin:round}.nav-btn:hover svg{stroke:var(--text-primary)}.shortcut-hint{letter-spacing:.15em;text-transform:uppercase;color:var(--text-dim);text-shadow:0 1px 4px #0006;font-size:.55rem}.loading-bar{background:var(--accent);z-index:10;height:1px;box-shadow:0 0 12px var(--accent-dim);transition:width .3s;position:fixed;top:0;left:0}.error-msg{text-align:center;z-index:5;display:none;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}.error-msg h2{color:var(--text-secondary);margin-bottom:.5rem;font-family:Cormorant Garamond,serif;font-size:1.4rem;font-weight:300}.error-msg p{color:var(--text-dim);font-size:.75rem}@keyframes fadeUp{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.nav-btn:focus-visible{outline:1px solid var(--accent);outline-offset:2px}@media (width<=640px){#ui{padding:1.5rem 1.2rem}.artwork-info{max-width:100%}.artwork-info .title{font-size:1.4rem}.shortcut-hint{display:none}.nav-btn{width:36px;height:36px}}
