@media(min-width:900px){.ic-app{grid-template-columns:minmax(0,1fr) 360px;align-items:start}.ic-detail{max-height:calc(100vh - var(--header-h) - 32px);max-height:calc(100dvh - var(--header-h) - 32px);overflow:auto;overscroll-behavior:contain;scrollbar-width:thin}}@media(min-width:1100px){.ic-app{grid-template-columns:minmax(0,1fr) 380px}}.ic-qlabel{display:block;margin:0;font-size:var(--fs-14);font-weight:600;line-height:1.4}.ic-search{position:sticky;top:calc(var(--header-h) + env(safe-area-inset-top,0px));z-index:3;margin:0 calc(var(--panel-pad) * -1);padding:6px var(--panel-pad) 8px;background:var(--surface-1)}.ic-qwrap{position:relative;display:block}.ic-qwrap>svg{position:absolute;left:16px;top:50%;transform:translateY(-50%);color:var(--fg-2);pointer-events:none}.ic-search #ic-q{min-height:52px;padding-left:48px;border-radius:var(--r-lg)}@media(hover:hover)and (min-width:600px){.ic-search #ic-q{padding-right:48px}}.ic-qwrap kbd{position:absolute;right:12px;top:50%;transform:translateY(-50%);min-width:26px;padding:4px 8px;border-radius:var(--r-xs);background:var(--surface-2);box-shadow:inset 0 -1px 0 var(--line);color:var(--fg-2);font:600 var(--fs-12)/1 var(--font-mono);text-align:center;pointer-events:none}#ic-q:focus~kbd,#ic-q:not(:placeholder-shown)~kbd{display:none}@media(hover:none),(max-width:599px){.ic-qwrap kbd{display:none}}.ic-count{margin:0;min-height:1.45em;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}.ic-grid,.ic-state{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:6px;grid-template-columns:repeat(auto-fill,minmax(68px,1fr))}.ic-state[hidden]{display:none}.ic-state span{height:76px;border-radius:var(--r-md);background:linear-gradient(90deg,var(--surface-2) 0%,var(--surface-3) 50%,var(--surface-2) 100%) 0 0/200% 100%;animation:ic-shimmer 1.2s linear infinite}@keyframes ic-shimmer{to{background-position:-200% 0}}.ic-btn{display:grid;justify-items:center;align-content:center;gap:8px;width:100%;min-height:76px;padding:12px 4px 8px;border:0;border-radius:var(--r-md);background:var(--canvas);color:var(--fg);font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;scroll-margin:calc(var(--header-h) + 80px) 0 24px;transition:background-color var(--dur-2) var(--ease-out),box-shadow var(--dur-2) var(--ease-out),transform var(--dur-1) var(--ease-out)}.ic-btn svg{width:24px;height:24px;flex:none}.ic-btn:active{transform:scale(.96)}@media(hover:hover){.ic-btn:not([aria-current=true]):hover{background:var(--surface-3)}}.ic-btn[aria-current=true]{background:var(--accent-soft);box-shadow:inset 0 0 0 2px var(--fg)}.ic-lbl{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.6875rem;line-height:1.2;color:var(--fg-2)}.ic-btn[aria-current=true] .ic-lbl{color:var(--fg);font-weight:600}@media(min-width:600px){.ic-grid,.ic-state{gap:8px;grid-template-columns:repeat(auto-fill,minmax(88px,1fr))}.ic-btn,.ic-state span{min-height:88px;height:auto}.ic-state span{height:88px}.ic-lbl{font-size:var(--fs-12)}}.ic-more{display:flex;justify-content:center;margin-top:16px}.ic-more .btn{flex:none}.ic-more [hidden]{display:none}.ic-empty{margin-top:12px;border-radius:var(--r-lg);background:var(--canvas);overflow-wrap:anywhere}.ic-empty[hidden]{display:none}.ic-empty p{margin:0;max-width:40ch}.ic-empty>svg{background:var(--surface-1);box-shadow:var(--e-1)}.ic-error{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px}.ic-error p{margin:0;flex:1 1 200px}.ic-error[hidden]{display:none}.ic-credit{margin:20px 0 0;text-align:center;text-wrap:pretty}.ic-credit a{color:var(--fg)}.ic-head{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}.ic-head-text{flex:1;min-width:0}.ic-overline{margin:0 0 2px}.ic-title{margin:0;font:700 var(--fs-20)/1.3 var(--font-mono);letter-spacing:-.01em;overflow-wrap:anywhere}.ic-detail:not(.has-icon) .ic-title{font-family:var(--font-sans)}.ic-title:focus{outline:none}.ic-back{margin:-2px -10px 0 0;color:var(--fg-2)}.ic-back[hidden]{display:none}@media(min-width:900px){.ic-back{display:none}}.ic-hint{margin:6px 0 0;overflow-wrap:anywhere}.ic-hint[hidden]{display:none}.ic-preview{display:grid;place-items:center;height:232px;margin-top:14px;border-radius:var(--r-lg);overflow:hidden;color:#0a0a0a;background:repeating-conic-gradient(#eef0ea 0 25%,#fff 0 50%) 0 0/16px 16px;box-shadow:inset 0 0 0 1px var(--line);transition:background-color var(--dur-2) var(--ease-out)}.ic-preview[data-bg=dark]{background:repeating-conic-gradient(#20241f 0 25%,#141613 0 50%) 0 0/16px 16px}.ic-detail:not(.has-icon) .ic-preview{background:var(--surface-2);box-shadow:none}.ic-placeholder{display:grid;place-items:center;width:72px;height:72px;border-radius:50%;background:var(--surface-1);color:var(--fg-2);box-shadow:var(--e-1)}.has-icon .ic-preview-box svg{display:block;animation:ic-pop var(--dur-2) var(--ease-out) both}@keyframes ic-pop{0%{opacity:0;transform:scale(.92)}to{opacity:1;transform:none}}.ic-preview-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 12px;margin-top:10px}.ic-preview-bar[hidden]{display:none}.ic-preview-note{margin:0;min-width:0;font-variant-numeric:tabular-nums}.ic-bg{width:auto;flex:none}.ic-controls{display:grid;gap:10px;margin-top:14px;min-width:0}.ic-controls[hidden]{display:none}.ic-controls fieldset+fieldset{margin-top:0}.ic-controls legend{margin-bottom:0}.ic-tags{list-style:none;display:flex;gap:6px;margin:0;padding:0}.ic-tags[hidden]{display:none}.ic-tags li{flex:none}.ic-tag{display:inline-flex;align-items:center;min-height:var(--ctl-sm);padding:0 14px;border:0;border-radius:var(--r-pill);background:var(--surface-2);color:var(--fg);font:600 var(--fs-13)/1 var(--font-sans);white-space:nowrap;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;transition:background-color var(--dur-2) var(--ease-out),transform var(--dur-1) var(--ease-out)}.ic-tag:active{transform:scale(.97)}@media(hover:hover){.ic-tag:hover{background:var(--surface-3)}}.ic-tag:focus-visible{outline-offset:-2px}@media(max-width:899px){.ic-tags{overflow-x:auto;margin-inline:calc(var(--panel-pad) * -1);padding:2px var(--panel-pad);scroll-padding-inline:var(--panel-pad);scroll-snap-type:x proximity;overscroll-behavior-x:contain;scrollbar-width:none;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 var(--panel-pad),#000 calc(100% - var(--panel-pad)),transparent);mask-image:linear-gradient(90deg,transparent 0,#000 var(--panel-pad),#000 calc(100% - var(--panel-pad)),transparent)}.ic-tags::-webkit-scrollbar{display:none}.ic-tags li{scroll-snap-align:start}}@media(min-width:900px){.ic-tags{flex-wrap:wrap}}.ic-color{display:grid;grid-template-columns:72px minmax(0,1fr);gap:12px;align-items:end}#ic-hex{font-family:var(--font-mono);text-transform:lowercase}.ic-detail .hint{margin:0;min-height:0;overflow-wrap:anywhere}.ic-detail .hint:empty{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.ic-detail .check{align-items:flex-start}.ic-detail .check input{margin-top:0}.ic-detail code{font-size:.85em;padding:1px 5px;border-radius:var(--r-xs);background:var(--surface-1)}.ic-lrow{display:flex;align-items:baseline;justify-content:space-between;gap:8px}.ic-val{padding:3px 8px;border-radius:var(--r-pill);background:var(--surface-1);font:600 var(--fs-13)/1 var(--font-mono);font-variant-numeric:tabular-nums;color:var(--fg-2)}.ic-pair{display:grid;grid-template-columns:minmax(0,1fr) 88px;gap:12px;align-items:end}.ic-pair input[type=range]{min-height:var(--field-h)}.ic-reset{justify-self:start;margin-left:-6px;color:var(--fg-2)}.ic-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}@media(max-width:419px){.ic-actions{grid-template-columns:1fr}}.ic-actions .btn{min-width:0;padding:0 12px}.ic-code{margin:0;padding:0 14px;border-radius:var(--r-lg);background:var(--surface-2);box-shadow:none}.ic-code summary{gap:8px;min-height:48px;padding:10px 0;font-size:var(--fs-14);font-weight:600}.ic-code summary svg{flex:none;color:var(--fg-2)}.ic-code .field{padding-bottom:14px}.ic-code textarea{font-size:.78rem;line-height:1.5;white-space:pre;overflow:auto;background:var(--field-bg);border-color:var(--line)}.ic-dock{position:sticky;bottom:0;z-index:4;flex-wrap:wrap;gap:8px;margin:16px calc(var(--panel-pad) * -1) calc(var(--panel-pad) * -1);padding:12px var(--panel-pad);border-radius:0 0 var(--r-xl) var(--r-xl);background:color-mix(in srgb,var(--surface-1) 88%,transparent);-webkit-backdrop-filter:saturate(1.6) blur(16px);backdrop-filter:saturate(1.6) blur(16px);box-shadow:0 -1px 0 var(--line)}@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.ic-dock{background:var(--surface-1)}}.ic-detail:not(.has-icon) .ic-dock{display:none}.ic-dock .btn{flex:1 1 0;min-width:0}@media(max-width:899px){.ic-dock{--dock-in:calc(var(--panel-pad) + var(--gutter));margin:16px calc(var(--dock-in) * -1) calc(var(--panel-pad) * -1);padding:12px var(--dock-in) max(12px,env(safe-area-inset-bottom));border-radius:0;box-shadow:var(--e-dock)}}@media(min-width:900px){.ic-dock{bottom:calc(var(--panel-pad) * -1)}}@media(max-width:419px){.ic-xs-hide{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}}.ic-status{flex:1 1 100%;margin:0;overflow-wrap:anywhere}.ic-status:empty{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.ic-status.is-error{background:var(--danger-bg);color:var(--danger-fg)}.ic-status.is-error:before{-webkit-mask-image:var(--i-warn);mask-image:var(--i-warn)}@media(min-width:600px)and (max-width:899px){.ic-detail.has-icon{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"head head" "prev ctl" "bar ctl" ". ctl" "dock dock";grid-template-rows:auto auto auto 1fr auto;column-gap:20px;align-items:start}.ic-detail.has-icon .ic-head{grid-area:head}.ic-detail.has-icon .ic-preview{grid-area:prev}.ic-detail.has-icon .ic-preview-bar{grid-area:bar}.ic-detail.has-icon .ic-controls{grid-area:ctl}.ic-detail.has-icon .ic-dock{grid-area:dock}}@media(prefers-reduced-motion:reduce){.ic-state span,.has-icon .ic-preview-box svg{animation:none}.ic-btn,.ic-btn:active,.ic-tag:active{transition:none;transform:none}}
