:root{color-scheme:dark;--ground:#111214;--surface:#1b1c20;--field:#27282e;--ink:#f2f1f5;--muted:#b2b0bc;--accent:#c9b5ff;--accent-ink:#191225;--gap:12px;--margin:24px;--body:16px;--small:14px;--heading:28px;--display:clamp(58px,8vw,112px)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;background:var(--ground);color:var(--ink);font-family:"Helvetica Neue","PingFang TC","Microsoft JhengHei",sans-serif;font-size:var(--body);line-height:1.5}button,input,select,textarea{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{cursor:pointer;border:0;background:var(--field);color:var(--ink);padding:12px 18px;min-height:46px;border-radius:0;transition:transform .18s ease,background-color .18s ease}button:hover{background:var(--surface);transform:translateY(-2px)}button:active{transform:translateY(1px)}button[aria-pressed=true],#copy-selection{background:var(--accent);color:var(--accent-ink)}button:disabled{opacity:.45;cursor:default;transform:none}a{color:inherit;text-decoration:none}a:hover{text-decoration:underline}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--accent);outline-offset:4px}::selection{background:var(--accent);color:var(--accent-ink)}p,h1,h2{margin:0}h1,h2{text-wrap:balance}h1{font-size:var(--display);line-height:1.04;letter-spacing:-.045em;font-weight:600}h2{font-size:var(--heading);line-height:1.2;letter-spacing:-.025em}.sr-only,.skip-link:not(:focus){position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.skip-link:focus{position:fixed;top:8px;left:8px;padding:12px;background:var(--accent);color:var(--accent-ink);z-index:20}.masthead{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:26px var(--margin)}.wordmark{font-weight:750;letter-spacing:-.035em;font-size:20px}.masthead nav{display:flex;align-items:center;gap:28px}.masthead button{background:transparent;padding:0;min-height:44px}.masthead span{margin-left:8px;font-variant-numeric:tabular-nums}.intro{padding:52px var(--margin) 40px}.intro-details{display:grid;grid-template-columns:1fr 1.2fr 1fr;gap:24px;margin-top:32px}.intro-details p:last-child{color:var(--muted)}#gallery{padding:0 var(--margin)}.toolbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;background:var(--surface);padding:16px}.search-field{flex:1 1 290px}.search-field input{width:100%;border:0;background:var(--field);color:var(--ink);padding:14px 16px;min-height:50px}.search-field input::placeholder{color:var(--muted)}.category-field select{padding:13px 36px 13px 14px;background:var(--field);color:var(--ink);border:0;min-height:50px;max-width:100%}.size-field{display:flex;align-items:center;gap:14px;padding:0 10px}.size-field input{width:80px;accent-color:var(--accent);min-height:44px}.results-line{display:flex;justify-content:space-between;align-items:center;padding:18px 0;gap:16px;font-size:var(--small)}.text-button{background:transparent;padding:8px 0;font-size:var(--small)}.image-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:28px var(--gap)}.image-grid.size-small{grid-template-columns:repeat(7,minmax(0,1fr))}.image-grid.size-large{grid-template-columns:repeat(3,minmax(0,1fr))}.artwork{min-width:0;animation:enter .45s both}.artwork-image{display:block;width:100%;padding:0;background:var(--surface);overflow:hidden;aspect-ratio:1;position:relative;min-height:0}.artwork-image:hover{background:var(--surface);transform:none}.artwork-image img{display:block;width:100%;height:100%;object-fit:contain;transition:transform .4s ease}.artwork-image:hover img,.artwork-image:focus-visible img{transform:scale(1.035)}.artwork-image .load-error{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:16px;background:var(--surface)}.artwork-caption{padding-top:12px;display:grid;grid-template-columns:1fr auto;gap:6px 10px}.artwork-caption h2{font-size:var(--body);line-height:1.4;letter-spacing:0;overflow-wrap:anywhere}.artwork-caption p{font-size:var(--small);color:var(--muted);grid-column:1}.artwork-caption data{font-variant-numeric:tabular-nums}.favorite{grid-column:2;grid-row:1/4;align-self:start;background:var(--surface);font-size:var(--small);padding:10px;min-width:48px;min-height:44px}.favorite[aria-pressed=true]{background:var(--accent);color:var(--accent-ink)}.artwork-id{font-size:var(--small);color:var(--muted)}.empty{padding:70px 0}.empty p{margin:20px 0}.selection{margin-top:120px;padding:60px var(--margin);display:flex;align-items:center;gap:32px;flex-wrap:wrap;background:var(--surface)}.selection>div{flex:1 1 360px}.selection p{max-width:52ch;margin-top:18px}.copy-status{flex-basis:100%;margin:0!important;color:var(--accent)}footer{padding:52px var(--margin) 32px;display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;font-size:var(--small);color:var(--muted)}dialog{border:0;background:var(--ground);color:var(--ink);padding:22px;width:min(1320px,96vw);max-height:95dvh;overscroll-behavior:contain}dialog::backdrop{background:rgb(0 0 0/.88)}.viewer-top,.viewer-bottom{display:flex;align-items:center;justify-content:space-between;gap:16px}.viewer-top{padding-bottom:16px}.viewer-top p{color:var(--muted);font-size:var(--small)}#viewer-close{background:var(--surface)}#viewer-close span{margin-left:14px}.viewer-body{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:32px}.viewer-art{background:var(--surface);display:grid;place-items:center;min-height:250px}.viewer-art img{display:block;width:100%;max-height:73dvh;object-fit:contain}.viewer-info{padding-top:20px;display:flex;flex-direction:column;gap:20px}.viewer-info h2{overflow-wrap:anywhere}.viewer-info p:first-child{font-variant-numeric:tabular-nums;color:var(--muted)}#viewer-favorite{margin-top:12px}#viewer-download{padding:12px 0;text-decoration:underline}.viewer-hint{font-size:var(--small);color:var(--muted);margin-top:auto}.viewer-bottom{padding-top:20px}#copy-dialog{width:min(600px,94vw);padding:28px}#copy-dialog p{margin:16px 0}#copy-text{width:100%;height:230px;background:var(--field);color:var(--ink);padding:14px;resize:vertical}#copy-close{margin-top:18px}[hidden]{display:none!important}@keyframes enter{from{opacity:.6;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}
.image-grid>article>a>img{display:block;width:100%;height:auto}.image-grid>article>a+h2{font-size:var(--body);margin-top:12px}.image-grid>article>a~p{font-size:var(--small);color:var(--muted)}
@media(min-width:1600px){.image-grid{grid-template-columns:repeat(6,minmax(0,1fr))}}
@media(max-width:1000px){.image-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.image-grid.size-small{grid-template-columns:repeat(5,minmax(0,1fr))}.intro-details{grid-template-columns:1fr 1fr}.intro-details p:last-child{grid-column:1/-1}.size-field{margin-left:auto}}
@media(max-width:700px){:root{--margin:16px;--gap:10px;--heading:24px}.masthead{padding-top:18px;padding-bottom:18px;gap:10px}.wordmark{font-size:17px}.masthead nav{gap:12px}.masthead nav>a{display:none}.masthead button{font-size:var(--small)}.intro{padding-top:28px;padding-bottom:28px}.intro-details{display:block;margin-top:24px}.intro-details p{margin-top:10px}.toolbar{padding:12px;gap:10px}.search-field{flex-basis:100%}.category-field{flex:1}.category-field select{width:100%}.size-field{display:none}.image-grid,.image-grid.size-small{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 10px}.image-grid.size-large{grid-template-columns:1fr}.artwork-caption{gap:4px}.favorite{padding:8px;min-width:44px}.artwork-caption h2{font-size:var(--body)}.selection{margin-top:70px;padding-top:36px;padding-bottom:36px;gap:22px}.selection>div{flex-basis:100%}.selection p{font-size:var(--body)}footer{padding-top:32px;flex-direction:column;gap:10px}.viewer-body{display:flex;flex-direction:column;gap:12px}.viewer-art img{max-height:55dvh}.viewer-info{padding:8px 0;gap:10px}.viewer-info h2{font-size:var(--heading)}.viewer-info button{margin-top:4px!important}.viewer-hint{display:none}.viewer-bottom{padding-top:12px}dialog{padding:14px}#viewer-download{padding:10px 0}.viewer-top{padding-bottom:12px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
