/* DraftOS advanced all-role + consensus + duo counter UI */

.context-head-actions{
    display:flex;
    align-items:center;
    gap:6px;
}

.counter-tool-btn{
    height:30px;
    padding:0 10px;
    border:1px solid rgba(10,200,185,.30);
    background:rgba(10,200,185,.06);
    color:#77d9d2;
    font-size:.58rem;
    font-weight:800;
    letter-spacing:.08em;
}

.counter-tool-btn:hover{
    border-color:rgba(10,200,185,.55);
    background:rgba(10,200,185,.10);
}

.counter-type-lists{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:7px;
    padding:9px;
}

.counter-type-column{
    min-width:0;
    border:1px solid rgba(255,255,255,.055);
    background:#06151e;
}

.counter-type-column.draftos-type{
    border-color:rgba(10,200,185,.15);
    background:
        linear-gradient(180deg,rgba(10,200,185,.025),transparent),
        #06151e;
}

.counter-type-title{
    min-height:52px;
    padding:8px;
    border-bottom:1px solid rgba(255,255,255,.05);
}

.counter-type-title strong{
    display:block;
    color:#d9e1e4;
    font-size:.64rem;
    letter-spacing:.10em;
}

.counter-type-title small{
    display:block;
    margin-top:3px;
    color:#607984;
    font-size:.55rem;
}

.advanced-counter-row{
    position:relative;
    display:grid;
    grid-template-columns:28px minmax(0,1fr) 46px;
    gap:7px;
    align-items:center;
    min-height:74px;
    padding:7px;
    border-bottom:1px solid rgba(255,255,255,.045);
    background:#071821;
}

.advanced-counter-row:last-child{
    border-bottom:0;
}

.counter-rank{
    width:25px;
    height:25px;
    display:grid;
    place-items:center;
    border:1px solid rgba(201,170,113,.22);
    color:#cab681;
    font-size:.62rem;
    font-weight:800;
}

.counter-copy{
    min-width:0;
    display:flex;
    flex-direction:column;
}

.counter-copy strong{
    color:#dbe4e7;
    font-size:.75rem;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

.counter-copy strong span{
    color:#627b86;
    padding:0 2px;
}

.counter-copy small{
    margin-top:3px;
    color:#637c87;
    font-size:.53rem;
    line-height:1.25;
}

.counter-score-box{
    display:flex;
    flex-direction:column;
    align-items:flex-end;
}

.counter-score-box span{
    color:#718994;
    font-size:.48rem;
    font-weight:800;
}

.counter-score-box strong{
    color:#d9c58f;
    font-size:.78rem;
}

.consensus-chip{
    align-self:flex-start;
    margin-top:5px;
    padding:2px 5px;
    border-radius:999px;
    font-size:.47rem;
    font-weight:900;
    letter-spacing:.05em;
}

.consensus-chip.double{
    color:#73ddd5;
    border:1px solid rgba(10,200,185,.25);
    background:rgba(10,200,185,.07);
}

.consensus-chip.triple{
    color:#f2d995;
    border:1px solid rgba(201,170,113,.42);
    background:rgba(201,170,113,.10);
}

.advanced-counter-row.consensus-double{
    box-shadow:inset 3px 0 0 rgba(10,200,185,.72);
    background:
        linear-gradient(90deg,rgba(10,200,185,.06),transparent 45%),
        #071821;
}

.advanced-counter-row.consensus-triple{
    border-color:rgba(201,170,113,.32);
    box-shadow:
        inset 4px 0 0 #c9aa71,
        0 0 20px rgba(201,170,113,.06);
    background:
        linear-gradient(90deg,rgba(201,170,113,.11),transparent 58%),
        #081923;
}

.counter-consensus-banner{
    display:flex;
    gap:10px;
    align-items:flex-start;
    margin:8px 9px 0;
    padding:9px 11px;
    border:1px solid rgba(10,200,185,.20);
    background:rgba(10,200,185,.045);
}

.counter-consensus-banner.triple{
    border-color:rgba(201,170,113,.40);
    background:
        linear-gradient(90deg,rgba(201,170,113,.11),transparent),
        #081923;
}

.consensus-icon{
    font-size:1.2rem;
    color:#75dcd5;
}

.counter-consensus-banner.triple .consensus-icon{
    color:#e7cc86;
}

.counter-consensus-banner small{
    display:block;
    color:#637c87;
    font-size:.50rem;
    font-weight:900;
    letter-spacing:.09em;
}

.counter-consensus-banner strong{
    display:block;
    margin-top:1px;
    color:#e0e7e9;
    font-size:.76rem;
}

.counter-consensus-banner p{
    margin:2px 0 0;
    color:#718994;
    font-size:.54rem;
}

.counter-empty{
    min-height:76px;
    display:grid;
    place-items:center;
    padding:10px;
    color:#627b86;
    text-align:center;
    font-size:.57rem;
}

/* Duo Counter */

.duo-counter-panel{
    margin-bottom:10px;
    border:1px solid rgba(10,200,185,.20);
    background:#06141d;
}

.duo-counter-head{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:9px 11px;
    border-bottom:1px solid rgba(255,255,255,.05);
}

.duo-counter-head small{
    display:block;
    color:#5e7884;
    font-size:.54rem;
    font-weight:900;
    letter-spacing:.12em;
}

.duo-counter-head h2{
    margin:2px 0 0;
    font-size:.88rem;
    color:#dce5e8;
}

.duo-counter-controls{
    display:grid;
    grid-template-columns:1.2fr 1.2fr .9fr .9fr auto;
    gap:7px;
    padding:9px 10px 6px;
}

.duo-counter-controls label{
    min-width:0;
}

.duo-counter-controls label>span{
    display:block;
    margin-bottom:3px;
    color:#627b86;
    font-size:.48rem;
    font-weight:800;
    letter-spacing:.08em;
}

.duo-counter-controls select{
    border-radius:1px;
    border-color:rgba(255,255,255,.08);
    background:#071821;
    font-size:.67rem;
}

.duo-presets{
    display:flex;
    gap:5px;
    padding:0 10px 8px;
}

.duo-presets button{
    padding:4px 7px;
    border:1px solid rgba(255,255,255,.07);
    background:#071821;
    color:#718994;
    font-size:.50rem;
    font-weight:800;
}

.duo-presets button:hover{
    color:#d5dfe3;
    border-color:rgba(201,170,113,.25);
}

.duo-counter-note{
    min-height:20px;
    padding:0 10px 6px;
    color:#718994;
    font-size:.55rem;
}

.duo-row .counter-copy strong{
    white-space:normal;
}

@media(max-width:1050px){
    .counter-type-lists{
        grid-template-columns:1fr;
    }

    .duo-counter-controls{
        grid-template-columns:1fr 1fr;
    }

    .duo-counter-controls .analyze-btn{
        grid-column:1/-1;
    }
}