/* ADRM digital components — review draft (검토 시안). Depends on tokens/color-tokens.css + assets/fonts/fonts.css */
:root{--adrm-font-ui:Pretendard,Pretendard,system-ui,sans-serif;--adrm-font-ko:Pretendard,Pretendard,system-ui,sans-serif;--adrm-font-essence:Quantico,sans-serif;--adrm-r:4px;--adrm-ease:cubic-bezier(.2,.7,.2,1);--adrm-t:160ms}
/* Buttons */
.adrm-btn{--bg:transparent;--fg:var(--adrm-text);--bd:transparent;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:44px;padding:0 18px;border:1px solid var(--bd);border-radius:var(--adrm-r);background:var(--bg);color:var(--fg);font:500 15px/1 var(--adrm-font-ui);letter-spacing:0;cursor:pointer;transition:background var(--adrm-t),border-color var(--adrm-t),color var(--adrm-t),transform 80ms;position:relative;white-space:nowrap;-webkit-tap-highlight-color:transparent}
.adrm-btn--primary{--bg:var(--adrm-action);--fg:var(--adrm-on-action)}
.adrm-btn--secondary{--bd:var(--adrm-border-strong)}
.adrm-btn--ghost{--fg:var(--adrm-text)}
.adrm-btn--icon{width:44px;padding:0;--bd:var(--adrm-border)}
.adrm-btn svg{width:18px;height:18px;flex:none}
.adrm-btn--primary:hover,.adrm-btn--primary[data-force=hover]{--bg:var(--adrm-action-hover)}
.adrm-btn--primary:active,.adrm-btn--primary[data-force=pressed]{--bg:var(--adrm-action-active)}
.adrm-btn--secondary:hover,.adrm-btn--secondary[data-force=hover],.adrm-btn--ghost:hover,.adrm-btn--ghost[data-force=hover],.adrm-btn--icon:hover,.adrm-btn--icon[data-force=hover]{--bg:var(--adrm-surface-raised)}
.adrm-btn--secondary:active,.adrm-btn--secondary[data-force=pressed],.adrm-btn--ghost:active,.adrm-btn--ghost[data-force=pressed],.adrm-btn--icon:active,.adrm-btn--icon[data-force=pressed]{--bg:var(--adrm-selection);--fg:var(--adrm-selection-text)}
.adrm-btn:active,.adrm-btn[data-force=pressed]{transform:translateY(1px)}
.adrm-btn:focus-visible,.adrm-btn[data-force=focus]{outline:2px solid var(--adrm-focus);outline-offset:3px}
.adrm-btn:disabled,.adrm-btn[data-force=disabled]{--bg:transparent;--fg:var(--adrm-text-disabled);--bd:var(--adrm-border);cursor:not-allowed;transform:none}
.adrm-btn--primary:disabled,.adrm-btn--primary[data-force=disabled]{--bg:var(--adrm-border);--bd:transparent}
.adrm-btn[data-state=working]{cursor:progress}
.adrm-btn[data-state=success]{--bg:var(--adrm-success-soft);--fg:var(--adrm-success);--bd:var(--adrm-success)}
.adrm-btn[data-state=failure]{--bg:var(--adrm-danger-soft);--fg:var(--adrm-danger);--bd:var(--adrm-danger)}
/* Inline loader: three render buckets */
.adrm-cells{display:inline-grid;grid-template-columns:repeat(3,6px);gap:3px;flex:none}
.adrm-cells i{width:6px;height:6px;background:currentColor;opacity:.25;animation:adrm-cell 900ms steps(1) infinite}
.adrm-cells i:nth-child(2){animation-delay:300ms}.adrm-cells i:nth-child(3){animation-delay:600ms}
@keyframes adrm-cell{0%{opacity:1}33%{opacity:.25}}
/* Resolve surface: render buckets + stepped clarify */
.adrm-resolve{position:relative;overflow:hidden;isolation:isolate;background:var(--adrm-surface)}
.adrm-resolve>.adrm-resolve__media{display:block;width:100%;height:100%;object-fit:cover}
.adrm-resolve__buckets{position:absolute;inset:0;display:grid;grid-template-columns:repeat(var(--cols,6),1fr);grid-template-rows:repeat(var(--rows,4),1fr);pointer-events:none;z-index:2}
.adrm-resolve__buckets i{background:var(--adrm-surface);border:.5px solid var(--adrm-border);opacity:1}
.adrm-resolve.is-rendering .adrm-resolve__buckets i{animation:adrm-bucket var(--bucket,220ms) var(--adrm-ease) forwards;animation-delay:var(--d)}
.adrm-resolve.is-resolved .adrm-resolve__buckets{display:none}
@keyframes adrm-bucket{to{opacity:0}}
.adrm-resolve.is-rendering .adrm-resolve__media{animation:adrm-clarify var(--clarify,1000ms) steps(6,end) forwards}
@keyframes adrm-clarify{from{filter:blur(24px) saturate(.4)}to{filter:none}}
.adrm-resolve__scan{position:absolute;left:0;right:0;top:0;height:1px;background:var(--adrm-ice-blue);z-index:3;opacity:0;pointer-events:none}
.adrm-resolve.is-rendering .adrm-resolve__scan{animation:adrm-scan 520ms 200ms linear forwards}
@keyframes adrm-scan{0%{opacity:.9;transform:translateY(0)}100%{opacity:0;transform:translateY(var(--h,400px))}}
.adrm-resolve__crop{position:absolute;inset:10px;z-index:3;pointer-events:none;opacity:0;--c:var(--adrm-ice-blue);background:linear-gradient(var(--c),var(--c)) 0 0/14px 1px,linear-gradient(var(--c),var(--c)) 0 0/1px 14px,linear-gradient(var(--c),var(--c)) 100% 0/14px 1px,linear-gradient(var(--c),var(--c)) 100% 0/1px 14px,linear-gradient(var(--c),var(--c)) 0 100%/14px 1px,linear-gradient(var(--c),var(--c)) 0 100%/1px 14px,linear-gradient(var(--c),var(--c)) 100% 100%/14px 1px,linear-gradient(var(--c),var(--c)) 100% 100%/1px 14px;background-repeat:no-repeat}
.adrm-resolve.is-rendering .adrm-resolve__crop{animation:adrm-crop 1500ms var(--adrm-ease) forwards}
@keyframes adrm-crop{0%,100%{opacity:0}15%,70%{opacity:1}}
.adrm-resolve__grid{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:0;background-image:linear-gradient(90deg,rgba(184,218,255,.18) 1px,transparent 1px),linear-gradient(rgba(184,218,255,.18) 1px,transparent 1px);background-size:calc(100%/16) calc(100%/9)}
.adrm-resolve.is-rendering .adrm-resolve__grid{animation:adrm-crop 900ms linear forwards}
.adrm-resolve__status{position:absolute;left:12px;bottom:12px;z-index:4;font:500 12px/1 var(--adrm-font-ui);color:var(--adrm-text);background:color-mix(in srgb,var(--adrm-canvas) 82%,transparent);padding:7px 9px;border-radius:2px;opacity:0;display:flex;align-items:center;gap:8px}
.adrm-resolve.is-rendering .adrm-resolve__status{opacity:1}
.adrm-resolve.is-resolved .adrm-resolve__status{opacity:0;transition:opacity 400ms 300ms}
.adrm-resolve[data-off~=bucket] .adrm-resolve__buckets,.adrm-resolve[data-off~=scan] .adrm-resolve__scan,.adrm-resolve[data-off~=crop] .adrm-resolve__crop,.adrm-resolve[data-off~=grid] .adrm-resolve__grid,.adrm-resolve[data-off~=status] .adrm-resolve__status{display:none}
.adrm-resolve[data-off~=clarify] .adrm-resolve__media{animation:none!important}
/* Segmented / tabs */
.adrm-seg{display:inline-flex;gap:2px;padding:3px;background:var(--adrm-surface-raised);border-radius:6px;max-width:100%;min-width:0;overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scrollbar-width:none}.adrm-seg>*{flex:0 0 auto}
.adrm-seg [role=tab],.adrm-seg button{min-height:38px;padding:0 14px;border:0;border-radius:4px;background:transparent;color:var(--adrm-text-muted);font:500 14px/1 var(--adrm-font-ui);cursor:pointer;white-space:nowrap}
.adrm-seg [aria-selected=true],.adrm-seg [aria-pressed=true]{background:var(--adrm-canvas);color:var(--adrm-text);box-shadow:inset 0 0 0 1px var(--adrm-border)}
.adrm-seg :focus-visible{outline:2px solid var(--adrm-focus);outline-offset:1px}
/* Project card */
.adrm-card{display:grid;gap:14px;color:var(--adrm-text);text-decoration:none;border-radius:var(--adrm-r);outline-offset:6px}
.adrm-card__media{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--adrm-surface)}
.adrm-card__media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 600ms var(--adrm-ease),opacity 300ms}
.adrm-card__media img+img{position:absolute;inset:0;opacity:0}
.adrm-card:hover .adrm-card__media img+img,.adrm-card:focus-visible .adrm-card__media img+img{opacity:1}
.adrm-card:hover .adrm-card__media img,.adrm-card:focus-visible .adrm-card__media img{transform:scale(1.02)}
.adrm-card:focus-visible{outline:2px solid var(--adrm-focus)}
.adrm-card__meta{display:flex;justify-content:space-between;gap:12px;font:400 13px/1.4 var(--adrm-font-ui);color:var(--adrm-text-muted)}
.adrm-card__title{font:600 19px/1.3 var(--adrm-font-ko);margin:0}
/* Modal */
.adrm-modal{border:0;padding:0;max-width:min(960px,calc(100vw - 32px));width:100%;background:var(--adrm-canvas);color:var(--adrm-text);border-radius:6px;box-shadow:0 30px 80px rgba(0,0,0,.5)}
.adrm-modal::backdrop{background:rgba(16,18,20,.78)}
.adrm-modal[open]{animation:adrm-in 220ms var(--adrm-ease)}
@keyframes adrm-in{from{opacity:0;transform:translateY(8px)}}
/* Chips */
.adrm-chip{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 8px;border-radius:3px;font:500 12px/1 var(--adrm-font-ui);background:var(--adrm-surface-raised);color:var(--adrm-text-muted);white-space:nowrap}
.adrm-chip--canon{background:var(--adrm-text);color:var(--adrm-canvas)}
.adrm-chip--draft{background:transparent;box-shadow:inset 0 0 0 1px var(--adrm-border-strong);color:var(--adrm-text)}
.adrm-chip--human{background:var(--adrm-selection);color:var(--adrm-selection-text)}
.adrm-chip--ai{background:var(--adrm-surface-raised);color:var(--adrm-text)}
.adrm-chip--ok{background:var(--adrm-success-soft);color:var(--adrm-success)}
.adrm-chip--wait{background:var(--adrm-warning-soft);color:var(--adrm-warning)}
/* Reduced motion */
@media (prefers-reduced-motion:reduce){.adrm-cells i,.adrm-resolve *{animation:none!important;transition:none!important}.adrm-cells i:nth-child(2){opacity:1}}
.adrm-reduce .adrm-cells i,.adrm-reduce .adrm-resolve *{animation:none!important;transition:none!important}.adrm-reduce .adrm-cells i:nth-child(2){opacity:1}
