/* PixelDeck 85.1 — unified interaction, mobile and accessibility layer */
:root{
  --pd-bg:#030b06;
  --pd-panel:#07150c;
  --pd-panel-2:#0b2112;
  --pd-line:rgba(156,255,122,.22);
  --pd-accent:#9cff7a;
  --pd-accent-2:#58d98b;
  --pd-text:#efffe9;
  --pd-muted:#9fb7a5;
  --pd-danger:#ff7f8e;
  --pd-radius:18px;
  --pd-shadow:0 18px 55px rgba(0,0,0,.38);
}

/* One visual language across home, gallery, discovery and museum. */
.view .panel,.view .glass-panel,.gallery-shell,.museum-shell,.discover-shell,
.profile-card,.detail-panel,.admin-card,.ranking-card,.archive-week{
  border-color:var(--pd-line);
  background:linear-gradient(155deg,rgba(10,31,17,.96),rgba(3,13,7,.94));
  box-shadow:var(--pd-shadow);
  border-radius:var(--pd-radius);
}
.view h1,.view h2,.view h3{letter-spacing:-.025em}
.view button,.view input,.view select,.view textarea{border-radius:12px}
.view button:focus-visible,.view a:focus-visible,.view input:focus-visible,.view select:focus-visible,.view textarea:focus-visible{
  outline:3px solid rgba(156,255,122,.58);outline-offset:3px;
}

/* Discover */
.discover-new-notice{
  position:sticky;top:74px;z-index:18;margin:0 auto 12px;display:flex;align-items:center;
  gap:9px;width:max-content;max-width:calc(100% - 24px);padding:10px 16px;border:1px solid var(--pd-line);
  background:rgba(7,24,13,.96);color:var(--pd-text);box-shadow:var(--pd-shadow);border-radius:999px;
}
.discover-new-notice.hidden,.discover-top-button.hidden{display:none!important}
.discover-filter-toggle{display:none}
.discover-mobile-filter-head{display:none}
#discoverArtworkGrid{position:relative;overflow-anchor:none}
.discover-virtual-spacer{grid-column:1/-1;height:var(--virtual-height,0);pointer-events:none}
.discover-art-card picture,.discover-art-card img{display:block;width:100%;height:100%}
.discover-art-card img{object-fit:cover;image-rendering:pixelated}
.discover-top-button{
  position:fixed;right:22px;bottom:22px;z-index:28;width:48px;height:48px;border-radius:50%!important;
  border:1px solid var(--pd-line);background:#0b2814;color:var(--pd-accent);font-size:21px;box-shadow:var(--pd-shadow)
}

/* Upload: readable recovery, validation and real progress. */
.direct-upload-paste-row{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:10px}
.upload-draft-recovery,.upload-duplicate-warning,.upload-progress-panel{
  margin:12px 0;padding:13px 15px;border:1px solid var(--pd-line);border-radius:14px;background:rgba(9,34,18,.84)
}
.upload-draft-recovery.hidden,.upload-duplicate-warning.hidden,.upload-progress-panel.hidden{display:none!important}
.upload-draft-recovery{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.upload-duplicate-warning{border-color:rgba(255,194,95,.5);color:#ffe0a0}
.upload-duplicate-warning a{color:inherit;font-weight:800}
.upload-progress-head{display:flex;justify-content:space-between;gap:10px;margin-bottom:9px}
.upload-progress-track{height:10px;overflow:hidden;border-radius:999px;background:rgba(255,255,255,.09)}
.upload-progress-fill,#directUploadProgressFill{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--pd-accent-2),var(--pd-accent));transition:width .18s ease}
#directUploadDropzone.is-pasting,#directUploadDropzone.is-hashing{border-color:var(--pd-accent);box-shadow:0 0 0 4px rgba(156,255,122,.12)}

/* Pixel quality check */
.upload-quality-panel{margin:12px 0 16px;padding:15px;border:1px solid var(--pd-line);border-radius:14px;background:linear-gradient(145deg,rgba(8,32,17,.96),rgba(4,17,10,.96))}
.upload-quality-panel.hidden{display:none!important}.upload-quality-head{display:flex;align-items:center;justify-content:space-between;gap:14px}.upload-quality-head>div{display:grid;gap:3px}.upload-quality-head span{font-size:9px;font-weight:900;letter-spacing:.12em;color:var(--pd-accent)}.upload-quality-head strong{font-size:15px}.upload-quality-head>b{font-size:20px;color:var(--pd-accent)}
#directUploadQualityBar{height:8px;margin:12px 0;overflow:hidden;border-radius:999px;background:rgba(255,255,255,.09)}#directUploadQualityBar i{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,#ff8e73,#ffd567 45%,var(--pd-accent));transition:width .2s ease}.upload-quality-panel[data-status="blocked"]{border-color:rgba(255,90,110,.6)}
#directUploadQualityIssues{display:grid;gap:7px;margin:0;padding:0;list-style:none}#directUploadQualityIssues li{display:flex;align-items:flex-start;gap:8px;color:var(--pd-muted);font-size:11px;line-height:1.4}#directUploadQualityIssues li>span{display:grid;width:18px;height:18px;flex:0 0 auto;place-items:center;border-radius:50%;background:rgba(255,255,255,.08);font-weight:900}.quality-pass>span{color:var(--pd-accent)}.quality-warning>span,.quality-error>span{color:#ffcc6f}

/* Optional work-in-progress upload */
.upload-making-of{margin-top:18px;padding:15px;border:1px solid var(--pd-line);border-radius:15px;background:rgba(4,19,10,.72)}.upload-making-of-head{display:flex;align-items:center;justify-content:space-between;gap:13px}.upload-making-of-head>div{display:grid;gap:4px}.upload-making-of-head small{max-width:430px;color:var(--pd-muted);font-size:10px;line-height:1.45}.upload-making-of-head label{cursor:pointer;white-space:nowrap}
.upload-making-of-list{display:grid;gap:8px;margin-top:12px}.upload-making-of-list>.hint{margin:4px 0}.upload-making-of-item{display:grid;grid-template-columns:58px minmax(0,1fr) auto;align-items:center;gap:10px;padding:8px;border:1px solid rgba(156,255,122,.14);border-radius:11px;background:rgba(255,255,255,.025)}.upload-making-of-item>img{width:58px;height:58px;object-fit:contain;image-rendering:pixelated;border-radius:7px;background:repeating-conic-gradient(#10251a 0 25%,#0a1a11 0 50%) 50%/10px 10px}.upload-making-of-item>div:nth-child(2){display:grid;gap:5px}.upload-making-of-item input{width:100%;min-height:36px}.upload-making-of-item small{color:var(--pd-muted)}.upload-making-of-actions{display:flex;gap:4px}.upload-making-of-actions button{min-width:34px;height:34px;padding:0}

/* Color DNA discovery */
.discover-color-filter{display:flex;align-items:center;gap:10px;margin:12px 0;padding:10px 12px;border:1px solid var(--pd-line);border-radius:13px;background:rgba(8,31,17,.9)}.discover-color-filter.hidden{display:none!important}.discover-color-filter>span:first-child{width:34px;height:34px;flex:0 0 auto;border:2px solid rgba(255,255,255,.72);border-radius:9px;box-shadow:3px 3px 0 rgba(0,0,0,.42)}.discover-color-filter>span:nth-child(2){display:flex;min-width:0;align-items:center;gap:8px}.discover-color-filter code{color:var(--pd-muted)}.discover-color-filter button{margin-left:auto}
.artwork-color-dna{display:grid;gap:11px;margin-top:15px;padding:14px;border:1px solid var(--pd-line);border-radius:13px;background:rgba(3,16,8,.82)}.artwork-color-dna>div:first-child{display:grid;gap:3px}.artwork-color-dna>div:first-child span,.making-of-heading span{font-size:9px;font-weight:900;letter-spacing:.13em;color:var(--pd-accent)}.artwork-color-dna>small{color:var(--pd-muted);line-height:1.45}.artwork-color-row{display:flex;gap:7px;overflow-x:auto;padding-bottom:2px}.artwork-color-row button{display:flex;min-width:max-content;align-items:center;gap:7px;padding:6px 9px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.035);color:var(--pd-text)}.artwork-color-row button:hover{border-color:var(--dna-color);transform:translateY(-1px)}.artwork-color-row i{display:block;width:25px;height:25px;border-radius:7px;background:var(--dna-color);box-shadow:inset 0 0 0 1px rgba(255,255,255,.28)}.artwork-color-row code{font-size:10px}

/* Making-of viewer */
.making-of-timeline{display:grid;gap:12px;margin-top:16px;padding:14px;border:1px solid var(--pd-line);border-radius:14px;background:linear-gradient(145deg,rgba(7,28,15,.95),rgba(2,13,7,.95))}.making-of-heading{display:flex;align-items:end;justify-content:space-between;gap:12px}.making-of-heading>div{display:grid;gap:3px}.making-of-heading h3{margin:0;font-size:17px}.making-of-heading>b{color:var(--pd-accent)}.making-of-stage{position:relative;display:grid;place-items:center;min-height:250px;overflow:hidden;border:1px solid rgba(156,255,122,.2);border-radius:11px;background:repeating-conic-gradient(#10251a 0 25%,#0a1a11 0 50%) 50%/18px 18px}.making-of-stage img{display:block;width:100%;height:clamp(250px,45vw,430px);object-fit:contain;image-rendering:pixelated}.making-of-stage span{position:absolute;left:10px;bottom:10px;padding:6px 9px;border:1px solid var(--pd-line);border-radius:999px;background:rgba(2,10,5,.88);font-size:10px}.making-of-timeline input[type="range"]{width:100%;accent-color:var(--pd-accent)}.making-of-rail{display:flex;gap:7px;overflow-x:auto;padding:2px}.making-of-rail button{position:relative;width:58px;height:58px;flex:0 0 58px;padding:3px;border:2px solid transparent;background:rgba(255,255,255,.04)}.making-of-rail button.active{border-color:var(--pd-accent);box-shadow:0 0 0 2px rgba(156,255,122,.12)}.making-of-rail img{width:100%;height:100%;object-fit:contain;image-rendering:pixelated}.making-of-rail span{position:absolute;right:2px;bottom:2px;display:grid;width:18px;height:18px;place-items:center;border-radius:50%;background:#061008;color:var(--pd-accent);font-size:9px}

/* Search command surface */
.global-search-tabs{display:flex;gap:6px;overflow:auto;padding:6px 4px 10px;scrollbar-width:none}
.global-search-tabs button{white-space:nowrap;padding:7px 11px;border:1px solid var(--pd-line);background:transparent;color:var(--pd-muted)}
.global-search-tabs button.active{background:var(--pd-accent);color:#061008;border-color:var(--pd-accent)}
.global-search-recent{padding:4px 3px 9px}
.global-search-recent.hidden{display:none}
.global-search-recent-list{display:flex;gap:6px;flex-wrap:wrap}
.global-search-recent button{padding:6px 10px;border:1px solid var(--pd-line);background:rgba(255,255,255,.04);color:var(--pd-text)}
.global-search-result.keyboard-active{background:rgba(156,255,122,.13);outline:2px solid rgba(156,255,122,.45)}
.search-highlight{background:rgba(156,255,122,.22);color:inherit;border-radius:3px;padding:0 1px}

/* Classic upload detail card, restored with optional zoom. */
.artwork-detail-classic{width:100%}
.artwork-detail-image-stage{position:relative;overflow:hidden;aspect-ratio:1;cursor:zoom-in;touch-action:pan-y}
.artwork-detail-image-stage.is-zoomed{cursor:zoom-out}
.artwork-detail-image-stage picture{display:grid;place-items:center;width:100%;height:100%;overflow:hidden}
.artwork-detail-zoom-image{display:block;width:100%!important;height:100%!important;max-width:none;max-height:none;object-fit:contain!important;image-rendering:pixelated;image-rendering:crisp-edges;transform:scale(var(--viewer-zoom,1));transform-origin:center;transition:transform .18s ease;filter:drop-shadow(0 16px 26px rgba(0,0,0,.28))}
.artwork-viewer-nav{position:absolute;top:50%;translate:0 -50%;width:44px;height:52px;border:1px solid var(--pd-line);background:rgba(2,10,5,.8);color:var(--pd-text);font-size:24px}
.artwork-viewer-nav.prev{left:10px}.artwork-viewer-nav.next{right:10px}
.viewer-zoom-controls{position:absolute;right:10px;bottom:10px;display:flex;gap:6px}
.viewer-zoom-controls button{min-width:42px;height:42px;padding:0 12px;border:1px solid var(--pd-line);background:rgba(2,10,5,.84);color:var(--pd-text)}
.classic-detail-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:14px;padding:10px;border:1px solid var(--pd-line);border-radius:12px;background:rgba(3,15,8,.92);box-shadow:4px 4px 0 rgba(0,0,0,.55)}
.classic-detail-actions>button{min-width:128px}.classic-detail-actions>span{padding:0 8px;color:var(--pd-muted)}

/* Onboarding */
.onboarding-progress{display:flex;justify-content:center;gap:8px;margin:0 0 18px}
.onboarding-progress i{display:block;width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.18)}
.onboarding-progress i.active{background:var(--pd-accent);box-shadow:0 0 0 5px rgba(156,255,122,.12)}
.onboarding-step{display:none}.onboarding-step.active{display:block}
.onboarding-interest-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin:16px 0}
.onboarding-interest-grid label{display:flex;align-items:center;gap:9px;padding:12px;border:1px solid var(--pd-line);border-radius:13px;background:rgba(255,255,255,.025)}
.onboarding-recommendations{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;min-height:90px}
.onboarding-recommendations img{width:100%;aspect-ratio:1;object-fit:cover;image-rendering:pixelated;border-radius:10px}
.onboarding-actions{display:flex;justify-content:space-between;gap:10px;margin-top:18px}
.admin-system-warnings{display:grid;gap:8px;margin:12px 0 20px}.admin-alert{padding:11px 13px;border:1px solid rgba(255,190,80,.5);border-radius:12px;background:rgba(98,58,5,.3);color:#ffe0a0}

/* Empty states are action-oriented and consistent. */
.empty-state.pd-empty{grid-column:1/-1;min-height:220px;display:grid;place-items:center;text-align:center;padding:30px;border:1px dashed var(--pd-line);border-radius:var(--pd-radius);background:radial-gradient(circle at 50% 0,rgba(43,122,62,.18),transparent 62%)}
.pd-empty-inner{max-width:430px}.pd-empty-icon{font-size:34px;margin-bottom:8px}.pd-empty-actions{display:flex;justify-content:center;gap:9px;flex-wrap:wrap;margin-top:16px}

@media(max-width:760px){
  body{padding-bottom:env(safe-area-inset-bottom)}
  .discover-filter-toggle{display:inline-flex;align-items:center;gap:7px}
  .discover-mobile-filter-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
  #discoverToolbar{
    position:fixed;z-index:80;inset:auto 0 0;max-height:min(70vh,520px);overflow:auto;padding:18px 16px calc(18px + env(safe-area-inset-bottom));
    border-radius:22px 22px 0 0;background:#06140b;box-shadow:0 -24px 70px rgba(0,0,0,.62);transform:translateY(105%);transition:transform .2s ease;
  }
  #discoverToolbar.mobile-open{transform:translateY(0)}
  body.discover-filter-open:before{content:"";position:fixed;inset:0;z-index:79;background:rgba(0,0,0,.58)}
  .discover-new-notice{top:64px}
  .discover-top-button{right:14px;bottom:calc(76px + env(safe-area-inset-bottom))}
  .artwork-detail-classic .artwork-title{font-size:clamp(24px,8vw,32px)}
  .artwork-detail-image-stage{padding:12px!important}
  .viewer-zoom-controls{right:7px;bottom:7px}
  .upload-making-of-head{align-items:flex-start;flex-direction:column}.upload-making-of-head label{width:100%;text-align:center}.upload-making-of-item{grid-template-columns:52px minmax(0,1fr)}.upload-making-of-item>img{width:52px;height:52px}.upload-making-of-actions{grid-column:1/-1;justify-content:flex-end}.discover-color-filter{align-items:flex-start;flex-wrap:wrap}.discover-color-filter button{width:100%;margin:0}.making-of-stage{min-height:210px}.making-of-stage img{height:70vw}
  .onboarding-interest-grid{grid-template-columns:1fr}
  .onboarding-recommendations{grid-template-columns:repeat(3,minmax(72px,1fr))}
  .modal-card{max-height:calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom));overflow:auto}
  button,input,select,textarea{min-height:44px}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}
}
