/* Homepage action hierarchy: primary actions, secondary controls and quiet shortcuts. */
.oh{--button-line:color-mix(in srgb,var(--ink) 15%,var(--card));--button-shadow:0 1px 2px #17230b09;--button-ring:color-mix(in srgb,var(--brand) 25%,transparent)}
.oh :is(button,.oh-action,.oh-workbench-action,.oh-shortcuts-heading>a,.oh-workbench-alternatives>a,.oh-recent-links>a){touch-action:manipulation;transition:background-color .16s,border-color .16s,color .16s,box-shadow .16s,transform .16s}
.oh :is(a,button,select,summary):focus-visible{outline:3px solid var(--brand);outline-offset:3px}
/* A tactile primary action with a dedicated arrow area. */
.oh .oh-workbench-action{min-height:56px;padding:8px 9px 8px 18px;gap:14px;border-radius:13px;border:1px solid color-mix(in srgb,var(--bench-tone) 83%,#172015);background:linear-gradient(180deg,color-mix(in srgb,var(--bench-tone) 92%,white),var(--bench-tone));box-shadow:inset 0 1px 0 #ffffff24,0 2px 0 color-mix(in srgb,var(--bench-tone) 72%,#172015),0 5px 12px #18270f0e;font-size:13px;font-weight:650;letter-spacing:-.01em;line-height:1.4;filter:none}
.oh .oh-workbench-action>svg{width:35px;height:35px;padding:9px;box-sizing:border-box;border:1px solid #ffffff26;border-radius:9px;background:#ffffff14;stroke-width:2;transition:background .16s,transform .16s}
.oh .oh-workbench-action:hover{filter:none;background:linear-gradient(180deg,color-mix(in srgb,var(--bench-tone) 97%,white),color-mix(in srgb,var(--bench-tone) 88%,#172015));box-shadow:inset 0 1px 0 #ffffff25,0 2px 0 color-mix(in srgb,var(--bench-tone) 72%,#172015),0 7px 17px #18270f1a;transform:translateY(-1px)}
.oh .oh-workbench-action:hover>svg{background:#ffffff24;transform:translateX(1px)}
.oh .oh-workbench-action:active{transform:translateY(1px);box-shadow:inset 0 2px 4px #00000016,0 1px 0 color-mix(in srgb,var(--bench-tone) 72%,#172015)}
/* Secondary actions stay compact, but look and behave like buttons. */
.oh .oh-action,.oh .oh-shortcuts-heading>a{min-height:46px;padding:8px 14px;border:1px solid var(--button-line);border-radius:12px;background:var(--card);color:var(--ink);font-size:12px;line-height:1.4;font-weight:600;gap:12px;box-shadow:inset 0 1px 0 #ffffff14,var(--button-shadow);text-decoration:none}
.oh .oh-action>svg{width:18px;height:18px;flex:none;stroke-width:1.8}
.oh .oh-shortcuts-heading>a>span{width:28px;height:28px;border:0;border-radius:8px;background:var(--soft);color:var(--brand)}
.oh :is(.oh-action,.oh-shortcuts-heading>a):hover{border-color:color-mix(in srgb,var(--brand) 48%,var(--line));background:color-mix(in srgb,var(--brand) 4%,var(--card));color:var(--brand-d);box-shadow:0 3px 8px #17230b0c;transform:translateY(-1px)}
.oh :is(.oh-action,.oh-shortcuts-heading>a):active{transform:translateY(1px);box-shadow:inset 0 1px 3px #17230b10}
.oh .oh-load .oh-action{padding:11px 21px;min-height:49px}.oh .oh-beyond .oh-action{border-color:var(--brand);background:var(--brand);color:var(--bg);box-shadow:inset 0 1px 0 #ffffff26,0 2px 0 color-mix(in srgb,var(--brand) 70%,#172015)}
/* Card actions have a full button-shaped surface, without nesting controls inside links. */
.oh .oh-card-bottom{min-height:44px;padding:6px 7px 6px 12px;gap:9px;border:1px solid color-mix(in srgb,var(--tone) 23%,var(--line));border-radius:10px;background:color-mix(in srgb,var(--tone) 5%,var(--card));color:var(--ink);font-size:12px;font-weight:600;line-height:1.4;box-shadow:inset 0 1px 0 #ffffff18;transition:background .16s,border-color .16s,box-shadow .16s}
.oh .oh-card-bottom>span{width:29px;height:29px;border-radius:7px;background:var(--tone);color:#fff;box-shadow:inset 0 1px 0 #ffffff24;flex:none}.oh .oh-card-bottom svg{width:15px;height:15px;stroke-width:1.8}
.oh .oh-card:is(:hover,:focus-within) .oh-card-bottom{background:color-mix(in srgb,var(--tone) 11%,var(--card));border-color:color-mix(in srgb,var(--tone) 55%,var(--line));box-shadow:0 2px 5px #00000005}.oh .oh-card:hover .oh-card-bottom>span{transform:none}.oh .oh-card-link:active .oh-card-bottom{box-shadow:inset 0 2px 3px #00000010}
.oh .oh-shortcut-arrow{width:32px;height:32px;border:1px solid color-mix(in srgb,var(--tone) 20%,var(--line));border-radius:9px;background:color-mix(in srgb,var(--tone) 6%,var(--card));color:var(--tone);box-shadow:var(--button-shadow)}.oh .oh-shortcut-arrow svg{width:15px;height:15px;stroke-width:1.8}.oh .oh-shortcut-link:is(:hover,:focus-visible) .oh-shortcut-arrow{background:var(--tone);color:white;border-color:var(--tone);transform:translateX(2px)}.oh .oh-shortcut-link:active .oh-shortcut-arrow{transform:translateX(1px);box-shadow:inset 0 2px 3px #0002}
/* Search examples and alternate actions are quiet, clearly bounded buttons. */
.oh .oh-examples{gap:7px;margin-top:12px}.oh .oh-examples>span{font-size:10px;margin-right:2px}
.oh .oh-examples button,.oh .oh-search-hints button,.oh .oh-workbench-alternatives>a{display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:7px 10px;gap:6px;border:1px solid var(--line);border-radius:8px;background:var(--card);color:var(--ink-2);font-size:10px;line-height:1.4;font-weight:500;box-shadow:0 1px 1px #00000003;text-decoration:none}
.oh :is(.oh-examples button,.oh-search-hints button,.oh-workbench-alternatives>a):hover{background:var(--soft);border-color:color-mix(in srgb,var(--brand) 35%,var(--line));color:var(--brand-d)}
.oh :is(.oh-examples button,.oh-search-hints button,.oh-workbench-alternatives>a):active{box-shadow:inset 0 1px 3px #0000000e;transform:translateY(1px)}
.oh .oh-workbench-alternatives{gap:8px;margin-top:13px}.oh .oh-workbench-alternatives>span{margin-right:2px}
/* Selection controls use inset accents and a persistent state, independent of hover. */
.oh .oh-workbench-switch{padding:4px;border-radius:12px;gap:4px;background:color-mix(in srgb,var(--ink) 3%,var(--card));box-shadow:inset 0 1px 3px #00000005}.oh .oh-workbench-switch label{min-height:42px;border-radius:8px;font-weight:600}.oh .oh-workbench-switch label:has(input:checked){color:var(--bench-tone);border-color:color-mix(in srgb,var(--bench-tone) 30%,var(--line));background:var(--card);box-shadow:0 1px 3px #00000009,inset 0 -2px 0 var(--bench-tone)}.oh .oh-workbench-switch label:active{background:var(--soft)}
.oh .oh-filter-nav button{min-height:45px;border-radius:10px;padding:10px 12px;font-size:12px}.oh .oh-filter-nav button[aria-pressed=true]{background:color-mix(in srgb,var(--brand) 8%,var(--card));border-color:color-mix(in srgb,var(--brand) 28%,var(--line));box-shadow:inset 3px 0 0 var(--brand);font-weight:650}.oh .oh-filter-nav button small{display:flex;align-items:center;justify-content:center;min-width:23px;min-height:22px;padding:2px 4px;border-radius:6px;opacity:1;font-size:10px}.oh .oh-filter-nav button[aria-pressed=true] small{background:var(--card);box-shadow:0 1px 2px #00000006;color:var(--brand-d)}
.oh .oh-favorite{border-radius:11px;border-color:color-mix(in srgb,var(--tone) 23%,var(--card));box-shadow:0 2px 4px #00000006;background:var(--card);color:var(--ink-2)}.oh .oh-favorite svg{stroke-width:1.8}.oh .oh-favorite:hover{border-color:var(--brand);box-shadow:0 3px 8px #00000010;transform:translateY(-1px)}.oh .oh-favorite[aria-pressed=true]{background:var(--brand);color:var(--bg);border-color:var(--brand);box-shadow:inset 0 1px 0 #ffffff20,0 2px 4px #0000000a}.oh .oh-favorite:active{transform:translateY(1px);box-shadow:inset 0 1px 3px #0002}
.oh .oh-search-clear{border-radius:8px;min-width:36px;min-height:36px}.oh .oh-search-clear:hover{background:var(--soft);box-shadow:inset 0 0 0 1px var(--line)}.oh .oh-results-meta button,.oh .oh-recents .oh-section-heading>button{min-height:36px;padding:7px 10px;border:1px solid var(--line);border-radius:8px;background:var(--card);color:var(--mut);font-size:10px;line-height:1.4}.oh :is(.oh-results-meta button,.oh-recents .oh-section-heading>button):hover{background:var(--soft);color:var(--ink);border-color:var(--button-line)}
.oh .oh-recent-links a{min-height:40px;border-radius:9px;box-shadow:var(--button-shadow);font-weight:500}
html[data-theme=dark] .oh .oh-workbench-action{border-color:color-mix(in srgb,var(--bench-tone) 85%,white);box-shadow:inset 0 1px 0 #ffffff30,0 2px 0 color-mix(in srgb,var(--bench-tone) 55%,black),0 4px 10px #0002}html[data-theme=dark] .oh .oh-workbench-action>svg{background:#17201512;border-color:#17201520}html[data-theme=dark] .oh .oh-workbench-action:hover>svg{background:#17201520}
html[data-theme=dark] .oh .oh-card-bottom>span{background:color-mix(in srgb,var(--tone) 75%,white);color:#111713}html[data-theme=dark] .oh .oh-shortcut-arrow{color:color-mix(in srgb,var(--tone) 50%,white)}html[data-theme=dark] .oh .oh-shortcut-link:is(:hover,:focus-visible) .oh-shortcut-arrow{color:white;background:var(--tone)}html[data-theme=dark] .oh .oh-favorite[aria-pressed=true]{color:#172015}
@media(max-width:900px) and (min-width:761px){.oh .oh-workbench-alternatives>a{font-size:9px;padding:7px 8px}.oh .oh-shortcut-link{gap:7px}.oh .oh-shortcut-arrow{width:28px;height:28px}}
@media(max-width:760px){.oh .oh-workbench-action{min-height:52px;padding:7px 8px 7px 15px;font-size:12px}.oh .oh-workbench-action>svg{width:34px;height:34px;padding:8px}.oh .oh-workbench-switch label{min-height:40px}.oh .oh-shortcuts-heading{align-items:center}.oh .oh-shortcuts-heading>a{max-width:110px;min-height:44px;padding:7px 9px;gap:7px;font-size:9px;line-height:1.4;border-radius:10px}.oh .oh-shortcuts-heading>a>span{width:23px;height:23px;flex:none;background:transparent}.oh .oh-shortcuts-heading>a svg{width:15px;height:15px}.oh .oh-card-bottom{min-height:41px;font-size:11px;padding:5px 6px 5px 9px}.oh .oh-card-bottom>span{width:26px;height:26px}.oh .oh-card-bottom svg{width:14px;height:14px}.oh .oh-shortcut-arrow{width:30px;height:30px}.oh .oh-workbench-alternatives{gap:7px}.oh .oh-workbench-alternatives>a{font-size:9px;padding:7px 8px}.oh .oh-examples>span{display:none}}
@media(max-width:360px){.oh .oh-shortcuts-heading>a{max-width:90px;font-size:8px;padding:7px}.oh .oh-workbench-alternatives>span{display:none}.oh .oh-workbench-alternatives>a{flex:1}.oh .oh-card-bottom{font-size:10px;padding-left:8px;gap:5px}.oh .oh-shortcut-link{gap:8px}.oh .oh-shortcut-text strong{font-size:11px}}
@media(pointer:coarse){.oh :is(.oh-examples button,.oh-search-hints button,.oh-workbench-alternatives>a,.oh-search-clear,.oh-results-meta button){min-height:44px}.oh .oh-workbench-switch label{min-height:44px}}
@media(prefers-reduced-motion:reduce){.oh :is(button,a,.oh-card-bottom,.oh-shortcut-arrow){transition:none!important}.oh :is(.oh-workbench-action,.oh-action,.oh-favorite,.oh-shortcuts-heading>a):hover,.oh :is(.oh-workbench-action,.oh-action,.oh-favorite,.oh-shortcuts-heading>a):active{transform:none}}