:root{color-scheme:dark;--black:#050505;--ivory:#e9e0cf;--blood:#b12b50;--line:#e9e0cf2a;--ambient-image:url('assets/design-ideas/bittergrip-lily.jpeg');font-family:'Courier New',monospace;background:var(--black);color:var(--ivory)}*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--black)}body{min-height:100svh;overflow-x:hidden}body:before{content:'';position:fixed;inset:0;z-index:5;pointer-events:none;opacity:.045;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.79' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23n)' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit}a{color:inherit;text-decoration:none}a:focus-visible,button:focus-visible{outline:2px solid var(--ivory);outline-offset:7px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.skip{position:fixed;top:-80px;left:20px;z-index:10;background:var(--ivory);color:var(--black);padding:10px}.skip:focus{top:12px}.scene{position:relative;isolation:isolate;min-height:100svh;display:grid;grid-template-rows:auto 1fr auto;padding:27px 4.2% 24px;overflow:hidden}.scene:before{content:'';position:absolute;inset:-10%;z-index:-3;background:var(--ambient-image) center/cover no-repeat;opacity:.16;filter:blur(34px) saturate(.65);transition:background-image .3s}.scene:after{content:'';position:absolute;inset:0;z-index:-2;background:radial-gradient(ellipse at 50% 42%,#05050500 5%,#050505cc 75%),linear-gradient(90deg,#050505 0%,transparent 30%,transparent 70%,#050505 100%);pointer-events:none}.masthead{display:flex;align-items:center;justify-content:space-between;font-size:9px;letter-spacing:3px;line-height:1;min-height:20px;position:relative;z-index:1}.origin{font-size:8px;letter-spacing:2px;color:#c4bbaa}.brand-sigil{width:25px;height:25px;display:flex;align-items:center;justify-content:center;color:var(--blood)}.brand-sigil svg{width:24px;height:24px}.quiet-mark{width:18px;height:18px;position:relative;opacity:.55}.quiet-mark:before,.quiet-mark:after{content:'';position:absolute;background:var(--ivory);left:8px;top:2px;width:1px;height:14px}.quiet-mark:after{transform:rotate(90deg)}.art-stage{width:100%;position:relative;display:flex;align-items:center;justify-content:center;min-height:0;padding:22px 0 28px}.artwork-frame{position:relative;margin:0;display:flex;align-items:center;justify-content:center;min-width:0;width:100%;max-width:940px;min-height:62svh}.artwork-image{display:block;max-width:100%;width:auto;height:auto;max-height:calc(100svh - 165px);object-fit:contain;mix-blend-mode:screen;filter:drop-shadow(0 0 45px #000b);animation:appear .5s ease-out both}.scene[data-tone='root'] .artwork-image{mix-blend-mode:normal;box-shadow:0 0 65px 15px #0009}.frame-corner{position:absolute;width:16px;height:16px;opacity:.35;border-color:var(--ivory);border-style:solid}.corner-tl{top:12%;left:2%;border-width:1px 0 0 1px}.corner-tr{top:12%;right:2%;border-width:1px 1px 0 0}.corner-bl{bottom:12%;left:2%;border-width:0 0 1px 1px}.corner-br{bottom:12%;right:2%;border-width:0 1px 1px 0}.marginal{position:absolute;left:0;top:50%;writing-mode:vertical-rl;transform:rotate(180deg);font-size:7px;letter-spacing:3px;color:#847769;pointer-events:none}.marginal-right{left:auto;right:0;transform:none}.scene-footer{position:relative;z-index:2;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;min-height:38px}.gallery-controls{display:flex;justify-content:center;align-items:center;gap:10px;grid-column:2}.gallery-controls button{display:flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:8px;background:transparent;color:#a69b8e;border:0;cursor:pointer;font-size:10px;letter-spacing:1px;position:relative;transition:color .2s}.gallery-controls button:after{content:'';position:absolute;bottom:2px;left:calc(50% - 7px);width:14px;height:1px;background:transparent;transition:background .2s,width .2s}.gallery-controls button[aria-pressed='true']{color:var(--ivory)}.gallery-controls button[aria-pressed='true']:after{background:var(--blood);width:20px;left:calc(50% - 10px)}.gallery-controls button:hover{color:var(--ivory)}.edition{font-size:8px;letter-spacing:3px;color:#978a7c;justify-self:start}.official-links{justify-self:end;display:flex;flex-wrap:wrap;justify-content:flex-end;gap:15px;font-size:8px;letter-spacing:1px}.official-links a{padding:9px 0}.official-links a:hover{color:var(--blood)}.official-links:empty{display:none}.quiet-content:empty{display:none}.quiet-content{max-width:900px;margin:0 auto;padding:0 5%}.quiet-content>div:empty{display:none}.music-links a,.show-row{display:flex;justify-content:space-between;gap:20px;padding:20px 0;border-top:1px solid var(--line);font-size:11px}.show-row span{flex:1}.show-row a{text-decoration:underline}.noscript-gallery{padding:20px;text-align:center;font-size:10px}.noscript-gallery a{margin:0 15px;text-decoration:underline}@keyframes appear{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}@media(min-width:1500px){.artwork-image{max-height:min(83svh,1050px)}}@media(max-width:720px){.scene{padding:22px 6% 23px}.masthead{font-size:8px;letter-spacing:2px}.origin{font-size:7px;letter-spacing:1px}.art-stage{padding:24px 0 26px}.artwork-frame{min-height:60svh}.artwork-image{max-height:calc(100svh - 175px);max-width:100%}.frame-corner{width:10px;height:10px}.corner-tl,.corner-bl{left:-8px}.corner-tr,.corner-br{right:-8px}.marginal{display:none}.scene-footer{gap:10px;grid-template-columns:1fr}.gallery-controls{grid-column:1;grid-row:1}.edition{justify-self:center;grid-row:2;font-size:7px}.official-links{grid-row:3;justify-self:center;justify-content:center}.gallery-controls{gap:14px}.scene[data-tone='root'] .artwork-image{max-width:88%}}@media(max-height:600px) and (min-width:721px){.scene{padding-top:15px;padding-bottom:12px}.art-stage{padding:10px 0}.artwork-frame{min-height:0}.artwork-image{max-height:calc(100svh - 120px)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
