/* 예측 시장(/predict) — 값은 style.css :root 를 씀 */
.pm-tiles .tile b{font-size:var(--t-lg)}
.pm-cats{overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none}.pm-cats::-webkit-scrollbar{display:none}
.pm-ctl{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px}
.pm-ctl .tabs a{font-size:var(--t-sm)}
.pm-q{margin-left:auto;flex:0 1 260px;min-width:180px}
.pm-q input{width:100%;height:var(--ctl);padding:0 12px;border-radius:var(--r);border:1px solid var(--line2);background:var(--field);color:var(--tx);font:inherit;font-size:var(--t-md)}
.pm-q input:focus{border-color:var(--line3);outline:0}
.pm-wrap{display:grid;grid-template-columns:200px minmax(0,1fr);gap:var(--gap);align-items:start}
.pm-side{position:sticky;top:110px;display:flex;flex-direction:column;gap:2px}
.pm-side a{display:flex;align-items:center;gap:4px;min-height:var(--ctl-l);padding:0 12px;border-radius:var(--r);color:var(--tx3);font-size:var(--t-md)}
.pm-side a span:first-of-type{flex:1}
.pm-side a .th-ic{margin:0 4px 0 0}
.pm-side a:hover{background:var(--hover);color:#fff}
.pm-side a.on{background:var(--line2);color:#fff;font-weight:600}
.pm-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:20px}
.pm-card{display:flex;flex-direction:column;gap:12px;background:var(--panel);border:1px solid var(--line);border-radius:var(--r-l);padding:16px;min-width:0}
.pm-card:hover{border-color:var(--line2)}
.pm-h{display:flex;align-items:center;gap:12px;min-height:48px}
.pm-img{flex:none;width:48px;height:48px;border-radius:var(--r);object-fit:cover;background:var(--panel2)}
.pm-ic{position:relative;display:grid;place-items:center;overflow:hidden}.pm-ic img{width:32px;height:32px}
.pm-ic img.pm-real{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:var(--panel2)}
.pm-ic img.pm-real.img-x{display:none}
.pm-h h3{font-size:var(--t-base);font-weight:600;line-height:var(--lh-t);min-width:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
.pm-h h3 a:hover{text-decoration:underline;text-underline-offset:2px}
.pm-outs{display:flex;flex-direction:column;gap:6px}
.pm-outs li{display:grid;grid-template-columns:minmax(0,1fr) auto auto 56px;align-items:center;gap:8px;font-size:var(--t-md);min-height:24px}
.pm-on{display:flex;align-items:center;gap:8px;min-width:0;color:var(--tx2)}
.pm-on>span{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pm-oi{flex:none;width:20px;height:20px;border-radius:50%;object-fit:cover;background:var(--panel2)}
.pm-oi.img-x{display:none}
.pm-outs b{font-weight:600;text-align:right;min-width:52px}
.pm-ch{font-size:var(--t-xs)}
.pm-bar{height:6px;border-radius:3px;background:var(--line);overflow:hidden}
.pm-bar i{display:block;height:100%;background:var(--gold);border-radius:3px}
.pm-more summary{cursor:pointer;font-size:var(--t-sm);color:var(--mut);min-height:28px;display:flex;align-items:center;list-style:none}
.pm-more summary::-webkit-details-marker{display:none}
.pm-more summary::after{content:"▾";margin-left:4px}.pm-more[open] summary::after{content:"▴"}
.pm-more summary:hover{color:#fff}
.pm-more .pm-outs{margin-top:6px;max-height:280px;overflow-y:auto;padding-right:4px}
.pm-f{margin-top:auto;display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;padding-top:12px;border-top:1px solid var(--line);font-size:var(--t-xs);color:var(--mut)}
.pm-f b{color:var(--tx2);font-weight:600}
.pm-src{padding:2px 6px;border-radius:var(--r-xs);font-weight:600}
.pm-src.pm{background:var(--ub);color:var(--ub-tx)}.pm-src.ks{background:#0E3B2E;color:#7BE0B5}
.pm-wait{color:var(--warn-tx)}
@media (max-width:1240px){.pm-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:1100px){.pm-tiles{grid-template-columns:repeat(3,minmax(0,1fr))}.pm-tiles .tile:nth-child(n+4){display:none}}
@media (max-width:900px){
 .pm-wrap{grid-template-columns:minmax(0,1fr)}
 .pm-side{position:static;flex-direction:row;overflow-x:auto;scrollbar-width:none;gap:4px}.pm-side::-webkit-scrollbar{display:none}
 .pm-side a{flex:none;min-height:var(--ctl);background:var(--panel);font-size:var(--t-sm)}
 .pm-side a span:first-of-type{flex:none}
 .pm-side a .num{margin-left:4px}
 .pm-q{margin-left:0;flex:1 1 100%}
}
@media (max-width:720px){
 .pm-grid{grid-template-columns:minmax(0,1fr)}
 .pm-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}.pm-tiles .tile:nth-child(n+3){display:none}
 .pm-ctl{gap:8px}
 /* 폰: 고른 칸이 화면 밖에 숨지 않게 가로 스크롤 대신 줄바꿈 */
 .pm-cats,.pm-side{flex-wrap:wrap;overflow:visible}
 .pm-cats a,.pm-ctl .tabs a{padding:0 10px;font-size:var(--t-sm)}
 .pm-side a{padding:0 10px}
 .pm-card{padding:12px}
 .pm-outs li{grid-template-columns:minmax(0,1fr) auto auto 40px;gap:6px}
}