@import url('./tokens.css');

.wpage{display:grid;gap:16px;color:var(--cw-ink);font:400 1rem/1.5 var(--font-ui);font-variant-numeric:tabular-nums}
.wpage__main{min-width:0;display:flex;flex-direction:column;gap:12px}
.wpage .back{align-self:flex-start;display:inline-flex;align-items:center;min-height:44px;min-width:44px;color:var(--cw-link);font-weight:600;text-decoration:none}
.wpage__head{display:flex;gap:14px;align-items:flex-start}
.wpage__art{position:relative;flex:none;width:96px;aspect-ratio:1;border-radius:6px;overflow:hidden;display:grid;place-items:center;background:var(--cw-chip);color:var(--cw-ink);filter:grayscale(1)}
.wpage__art .mono{font-size:1.25rem}
.wpage__t{min-width:0}
.wpage h1,.wpage__h{margin:0;font-size:1.5rem;font-weight:800;line-height:1.2}
.wpage__h .affil{vertical-align:middle;margin-left:6px}
.wpage__sub,.wpage__read{margin:4px 0 0;color:var(--cw-muted);font-size:.875rem;line-height:1.4}
.wpage__price{margin:6px 0 0;font-size:1.125rem;font-weight:700}
.wpage .up{color:var(--cw-up)}
.wpage .down{color:var(--cw-dn)}
.wpage .ref,.wpage .vo,.wpage .res,.wpage .honest,.wpage .wsent,.wpage .affilbox{margin:0;padding:12px 14px;border-radius:8px;font-size:.9375rem;line-height:1.45}
.wpage .ref{display:flex;flex-direction:column;gap:4px;background:var(--cw-white);border:1px solid var(--cw-line)}
.wpage .vo,.wpage .affilbox{background:var(--cw-chip);color:var(--cw-ink)}
.wpage .affilbox .affil{margin-right:8px}
.wpage .res,.wpage .honest,.wpage .wsent{background:var(--cw-white);border:1px solid var(--cw-line)}
.wpage .res--done{border-width:2px;border-color:var(--cw-ink)}
.wpage .markline{margin:0;font-size:.9375rem;line-height:1.4}
.wpage .lines4{display:flex;flex-direction:column;border-top:1px solid var(--cw-line)}
.wpage .line4{display:grid;grid-template-columns:7.5rem 1fr;column-gap:12px;padding:10px 0;border-bottom:1px solid var(--cw-line);font-size:.9375rem;line-height:1.4}
.wpage .line4>span{grid-row:span 2;color:var(--cw-muted)}
.wpage .line4 small{color:var(--cw-ink-2);font-size:.8125rem}
.wpage .line4 a{display:inline-flex;align-items:center;min-height:44px;color:var(--cw-link);font-weight:600}
.wpage .yesno{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.wpage .yn{min-height:56px;padding:8px 12px;border-radius:8px;border:1px dashed var(--cw-line);background:var(--cw-white);color:var(--cw-ink);font:700 1rem/1.2 var(--font-ui);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}
.wpage .yn small{font-weight:500;font-size:.75rem;color:var(--cw-ink-2)}
.wpage .drift{margin:0;overflow-x:auto}
.wpage .drift table{width:100%;border-collapse:collapse;font-size:.875rem}
.wpage .drift th,.wpage .drift td{padding:6px 8px;border-bottom:1px solid var(--cw-line);text-align:right;white-space:nowrap}
.wpage .drift th:first-child,.wpage .drift td:first-child{text-align:left}
.wpage .drift th{color:var(--cw-ink-2);font-weight:600}
.wpage .drift .dn{color:var(--cw-dn);font-weight:700}
.wpage .drift__cap{caption-side:top;padding:6px 8px;text-align:left;color:var(--cw-ink-2);font-size:.8125rem;line-height:1.4}
.wpage .drift__scope{margin:6px 0 0;color:var(--cw-ink-2);font-size:.8125rem;line-height:1.4}
.wpage .hnote{margin:6px 0 0;color:var(--cw-ink-2);font-size:.8125rem;line-height:1.4}
.wpage__none{margin:0;color:var(--cw-ink)}
.wpage .buybox{padding:14px;border:1px solid var(--cw-line);border-radius:8px;background:var(--cw-white)}
.wpage .buybox h2{margin:0;font-size:1.0625rem;font-weight:700;line-height:1.3}
.wpage .buybox .s{margin:2px 0 10px;color:var(--cw-muted);font-size:.8125rem}
.wpage .bb__min{margin:0 0 10px;font-size:.875rem;line-height:1.4}
.wpage .buybar{padding:12px 14px;border:1px dashed var(--cw-line);border-radius:8px;background:var(--cw-white);font-size:.9375rem;line-height:1.4}
.wpage__side{display:none}
@media(min-width:1200px){
 .wpage{grid-template-columns:minmax(0,1fr) 320px;align-items:start;gap:24px}
 .wpage__side{display:block;position:sticky;top:80px}
 .wpage .buybar{display:none}
}
