.op{--ch-l:var(--ch-user-l,#e3e8ee);--ch-d:var(--ch-user-d,#8297b1)}.op-list{flex-direction:column;gap:28px;display:flex}.op-side{flex-direction:column;gap:12px;display:flex}.op-grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:14px;display:grid}.op-card{color:var(--ink);grid-template-columns:88px minmax(0,1fr);align-items:start;gap:14px;padding:14px;text-decoration:none;transition:transform .14s;display:grid}.op-card:hover{transform:translateY(-2px)}.op-card h3{font-family:var(--f-display);font-size:19px;font-weight:400;line-height:1.15}.op-card p{font-size:13px}.op-card .op-tags{flex-wrap:wrap;gap:6px;margin-top:6px;display:flex}.op-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;display:flex}@media (prefers-reduced-motion:reduce){.op-card{transition:none}.op-card:hover{transform:none}}.op-mini{aspect-ratio:1;border:2px solid var(--ink);border-radius:3px;grid-template-columns:repeat(8,1fr);display:grid;overflow:hidden}.op-mini i{background:var(--ch-l);display:block;position:relative}.op-mini i.d{background:var(--ch-d)}.op-mini img{width:100%;height:100%;position:absolute;inset:0}.op-train{grid-template-columns:minmax(0,1fr) 300px;align-items:start;gap:16px;display:grid}.op-main{flex-direction:column;align-items:center;min-width:0;display:flex}.op-main>*{width:min(100%,100dvh - 250px);min-width:260px}@media (max-width:300px){.op-main>*{min-width:0}}.op-panel{flex-direction:column;gap:12px;min-width:0;display:flex}.op-modes{gap:6px;display:flex}.op-title{font-size:clamp(30px,5vw,44px)}.op-last{min-height:2.8em;font-size:14px}.op-say{font-family:var(--f-word);font-size:19px;line-height:1.3}.op-say.bad{color:var(--bad)}.op-say b{color:var(--accent);font-family:var(--f-mono);font-size:17px;font-weight:600}.op-why{border-left:3px solid var(--accent);padding-left:8px;font-size:14px}.op-line{font-family:var(--f-mono);background:var(--sunk);border-radius:var(--radius);flex-wrap:wrap;align-content:flex-start;gap:2px 6px;min-height:40px;padding:8px 10px;font-size:14px;display:flex}.op-line span{color:var(--muted)}.op-line span.played{color:var(--ink)}.op-line span.now{background:var(--accent);color:var(--accent-ink);border-radius:3px;padding:0 4px}.op-done{flex-direction:column;gap:10px;display:flex}.op-done .h2{color:var(--accent)}.op-notes{flex-direction:column;gap:6px;margin:0;padding-left:0;list-style:none;display:flex}.op-notes b{min-width:64px;display:inline-block}@media (max-width:860px){.op-train{grid-template-columns:1fr}.op-main>*{width:min(100%,100dvh - 300px)}.op-panel{width:min(100%,560px);margin-inline:auto}}@media (orientation:landscape) and (max-height:520px){.op-train{grid-template-columns:minmax(0,1fr) 260px}.op-main>*{width:min(100%,100dvh - 100px);min-width:0}}