/* Optional preview surface; option geometry follows the shared dropdown standard. */
:root{--control-option-previews-ready:1}
.cop-host{position:relative}
.cop-native{opacity:0!important;pointer-events:none!important}
.cop-trigger{position:absolute;display:flex;align-items:center;justify-content:space-between;padding:0 var(--ui-control-text-pad,.35em);border:1px solid transparent;border-radius:inherit;background:var(--control-fill,#1c2922);color:var(--ink,#e6eee9);font:inherit;text-align:left;cursor:pointer;box-sizing:border-box}
.cop-trigger::after{content:"⌄";margin-left:.4em}
.cop-trigger:focus-visible{outline:2px solid var(--accent,#9ec5b0);outline-offset:-2px}
.cop-trigger[hidden]{display:none!important}
.cop-trigger:disabled{opacity:.5;cursor:not-allowed}
.cop-popup{position:fixed;z-index:2150;max-width:calc(100vw - 16px);color:var(--ink,#e6eee9);font:var(--cop-font-size,13px)/1.5 "Microsoft YaHei","PingFang SC",sans-serif;box-sizing:border-box}
.cop-popup *{box-sizing:border-box}
.cop-choices,.cop-preview{border:1px solid var(--accent,#91b49f);border-radius:6px;background:var(--ui-floating-menu-fill,#17251c);box-shadow:0 9px 24px #0004}
.cop-choices{width:100%;overflow:hidden}
.cop-head{display:none}
.cop-dismiss{border:0;background:none;color:inherit;cursor:pointer;font:inherit;font-size:1.35em}
.cop-list{max-height:min(440px,calc(100dvh - 24px));overflow-y:auto;overscroll-behavior:contain;padding:0;scrollbar-width:thin}
.cop-option{display:flex;align-items:center;width:100%;border:0;border-radius:calc(var(--ui-density,1) * 8px);padding:.125em .25em;min-height:1.5em;background:transparent;color:inherit;text-align:left;font:inherit;line-height:1.25;letter-spacing:normal;cursor:pointer}
.cop-option:hover,.cop-option:focus-visible,.cop-option[data-active=true]{box-shadow:inset 0 0 0 1px var(--accent,#91b49f);background:var(--ui-floating-option-active-fill,#34513f);outline:none}
.cop-option[aria-selected=true]{box-shadow:inset 0 0 0 1px var(--accent,#91b49f);background:var(--ui-floating-option-active-fill,#34513f);color:var(--ui-floating-option-active-ink,var(--accent,#b1d9c1))}
.cop-option:disabled{opacity:.45;cursor:not-allowed}
.cop-row-name{display:block;overflow-wrap:anywhere}
.cop-preview{position:fixed;width:340px;max-width:calc(100vw - 16px);padding:10px;max-height:calc(100dvh - 16px);overflow-y:auto;font-size:var(--cop-font-size,13px)}
.cop-state{display:none}
.cop-title{display:block;font-size:1.08em;margin:0 0 3px}
.cop-summary{font-size:.85em;opacity:.8;margin-bottom:8px}
.cop-image{position:relative;display:block;width:100%;aspect-ratio:16/9;border:0;border-radius:4px;background:#080d0a;color:inherit;padding:0;overflow:hidden;cursor:default}
.cop-image img{display:block;width:100%;height:100%;object-fit:contain}
.cop-image[hidden],.cop-image img[hidden]{display:none}
.cop-image-status{position:absolute;inset:0;display:grid;place-items:center;padding:12px;font-size:12px}
.cop-image-status[hidden]{display:none}
.cop-note,.cop-actions{display:none}
.cop-apply,.cop-cancel{border:1px solid #819f8c;border-radius:5px;padding:6px 11px;font:inherit;cursor:pointer}
.cop-apply{flex:1;background:var(--accent,#a9cdb9);color:#142a1c}
.cop-cancel{background:transparent;color:inherit}
.cop-apply:disabled{opacity:.5}
.cop-touch .cop-actions{display:flex;gap:8px;margin-top:9px}
.cop-popup button:not(.cop-option):focus-visible{outline:2px solid var(--accent,#b5d7c3);outline-offset:1px}
@media(max-width:760px){
  .cop-popup{left:8px!important;top:auto!important;bottom:8px;width:calc(100vw - 16px);max-height:calc(100dvh - 16px);overflow-y:auto;border:1px solid var(--accent,#91b49f);border-radius:8px;background:var(--ui-floating-menu-fill,#17251c)}
  .cop-choices{border:0;border-radius:0;box-shadow:none}
  .cop-head{display:flex;justify-content:space-between;align-items:center;padding:7px 9px;border-bottom:1px solid #78948044;font-size:13px}
  .cop-list{max-height:min(27dvh,190px)}
  .cop-preview{position:static;width:100%;max-width:none;max-height:none;border:0;border-top:1px solid #78948044;border-radius:0;box-shadow:none;padding:9px 12px;font-size:13px;overflow:visible}
  .cop-image{aspect-ratio:auto;height:min(25dvh,200px)}
  .cop-title{font-size:17px}
  .cop-dismiss{min-width:32px;min-height:32px}
  .cop-apply,.cop-cancel{min-height:40px}
  .cop-actions{display:flex;gap:8px;margin-top:9px}
}