/* =============================================================
   Meeting Radar — dark technical theme
   "Ops console" aesthetic: mono accents, grid background, radar green
   ============================================================= */

@font-face{
    font-family: 'Kenyan Coffee';
    src: url('fonts/KenyanCoffee-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

:root{
    /* surfaces */
    --mr-bg:        #0a0d12;
    --mr-bg-2:      #0d1117;
    --mr-surface:   #11161e;
    --mr-surface-2: #161c26;
    --mr-elev:      #1a2230;

    /* lines */
    --mr-border:        #1f2731;
    --mr-border-strong: #2a3340;
    --mr-grid:          rgba(93,216,89,.045);

    /* text */
    --mr-text:       #e6edf3;
    --mr-text-muted: #8b97a8;
    --mr-text-dim:   #5a6573;

    /* signals */
    --mr-primary:        #5dd859; /* radar green — warm */
    --mr-primary-strong: #7ee37a;
    --mr-primary-soft:   rgba(93,216,89,.10);
    --mr-primary-glow:   rgba(93,216,89,.40);

    --mr-yes:        #5dd859;
    --mr-yes-soft:   rgba(93,216,89,.14);
    --mr-maybe:      #f7b955;
    --mr-maybe-soft: rgba(247,185,85,.14);
    --mr-no:         #5a6573;
    --mr-no-soft:    rgba(90,101,115,.18);
    --mr-best:       rgba(93,216,89,.10);
    --mr-danger:     #ff5d6c;
    --mr-danger-soft:rgba(255,93,108,.10);
    --mr-accent:     #4cc9ff;

    /* shapes — retro: sharp edges, harder shadows */
    --mr-radius:    0px;
    --mr-radius-sm: 0px;
    --mr-shadow:    0 0 0 1px rgba(93,216,89,.05) inset, 4px 4px 0 rgba(0,0,0,.45);

    /* type */
    --mr-font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
    --mr-font-mono: 'Roboto Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    --mr-font-logo: 'Kenyan Coffee', 'Roboto Mono', ui-monospace, sans-serif;
}

*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}

body{
    background:
        radial-gradient(1200px 600px at 80% -10%, rgba(93,216,89,.08), transparent 60%),
        radial-gradient(900px 500px at 0% 110%, rgba(93,216,89,.04), transparent 60%),
        linear-gradient(180deg, var(--mr-bg) 0%, var(--mr-bg-2) 100%);
    background-attachment: fixed;
    color: var(--mr-text);
    font-family: var(--mr-font-sans);
    font-size: 15px;
    line-height: 1.55;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    text-rendering: optimizeLegibility;
}

/* faint grid behind everything */
body::before{
    content:"";
    position:fixed;inset:0;
    background-image:
        linear-gradient(var(--mr-grid) 1px, transparent 1px),
        linear-gradient(90deg, var(--mr-grid) 1px, transparent 1px);
    background-size: 32px 32px;
    pointer-events:none;
    z-index:0;
    mask-image: radial-gradient(ellipse at center, #000 0%, transparent 85%);
    -webkit-mask-image: radial-gradient(ellipse at center, #000 0%, transparent 85%);
}

/* CRT scanlines overlay */
body::after{
    content:"";
    position:fixed; inset:0;
    pointer-events:none;
    z-index: 100;
    background: repeating-linear-gradient(
        to bottom,
        rgba(0,0,0,0) 0px,
        rgba(0,0,0,0) 2px,
        rgba(0,0,0,.18) 3px,
        rgba(0,0,0,0) 4px
    );
    mix-blend-mode: multiply;
    opacity: .55;
}

header, main, footer { position: relative; z-index: 1; }

a{color:var(--mr-primary);text-decoration:none}
a:hover{color:var(--mr-primary-strong);text-decoration:underline}

img{max-width:100%}
hr{border:0;border-top:1px solid var(--mr-border);margin:1rem 0}
code,kbd,samp{
    font-family: var(--mr-font-mono);
    font-size: .9em;
    background: var(--mr-surface-2);
    border: 1px solid var(--mr-border);
    padding: .12em .4em;
    border-radius: var(--mr-radius-sm);
    color: var(--mr-primary);
}

::selection{background:var(--mr-primary-soft);color:var(--mr-primary-strong)}

.mr-hidden{display:none !important}
.mr-muted{color:var(--mr-text-muted)}
.mr-mono{font-family:var(--mr-font-mono)}

/* =============================================================
   Layout
   ============================================================= */
.mr-container{max-width:1100px;margin:0 auto;padding:1.5rem 1.25rem;width:100%}
main.mr-container{flex:1}

.mr-header{
    background: rgba(13,17,23,.78);
    backdrop-filter: blur(10px) saturate(140%);
    -webkit-backdrop-filter: blur(10px) saturate(140%);
    border-bottom: 1px solid var(--mr-border);
    position: sticky;top:0;z-index:20;
}
.mr-header-inner{
    display:flex;align-items:center;justify-content:space-between;
    padding: .9rem 1.25rem;
    max-width:1100px;margin:0 auto;
}
.mr-brand{
    display:inline-flex;align-items:center;gap:.6em;
    font-family: var(--mr-font-logo);
    font-weight:400;font-size:1.35rem;letter-spacing:.04em;
    color:var(--mr-text);text-transform:lowercase;
    line-height:1;
}
.mr-brand:hover{color:var(--mr-primary);text-decoration:none}
.mr-brand-icon{
    width:22px;height:22px;display:inline-block;
}
.mr-brand-text{ position: relative; top: 1px; }

.mr-nav{display:flex;gap:.5rem;align-items:center}

.mr-footer{
    padding: 1.5rem 0 2rem;
    color: var(--mr-text-dim);
    font-size: .82rem;
    text-align: center;
    font-family: var(--mr-font-mono);
}
.mr-footer a{color:var(--mr-text-muted)}

/* =============================================================
   Cards
   ============================================================= */
.mr-card{
    background: var(--mr-surface);
    border: 1px solid var(--mr-border-strong);
    box-shadow: var(--mr-shadow);
    padding: 1.5rem 1.6rem;
    margin-bottom: 1.5rem;
    position: relative;
}
.mr-card>h1:first-child,.mr-card>h2:first-child,.mr-card>h3:first-child{margin-top:0}
.mr-card h1{
    font-family: var(--mr-font-logo);
    font-size: 2.1rem; letter-spacing: .01em;
    margin: 0 0 .35rem; font-weight: 400;
    text-transform: lowercase;
    color: var(--mr-text);
}
.mr-card h2{
    font-size: .8rem;
    margin: .25rem 0 1rem;
    font-family: var(--mr-font-mono);
    text-transform: uppercase;
    letter-spacing: .14em;
    color: var(--mr-primary);
    text-shadow: 0 0 6px rgba(93,216,89,.45);
    font-weight: 500;
    display: flex; align-items: baseline; gap: .35rem;
}
.mr-card h2::before{ content:"["; opacity:.85; }
.mr-card h2::after { content:"]"; opacity:.85; margin-left:.25rem; }
.mr-card h3{font-size:1rem;margin:.5rem 0 .75rem;font-weight:600}

/* =============================================================
   Buttons
   ============================================================= */
.mr-btn{
    display:inline-flex;align-items:center;gap:.45em;
    padding: .55rem 1.1rem;
    border: 1px solid var(--mr-primary);
    background: transparent;
    color: var(--mr-primary);
    font: inherit; font-weight: 500;
    font-family: var(--mr-font-mono);
    text-transform: lowercase;
    letter-spacing: .04em;
    cursor: pointer; text-decoration: none; line-height: 1.2;
    box-shadow: 3px 3px 0 rgba(93,216,89,.18);
    transition: background .1s, color .1s, box-shadow .1s, transform .06s;
}
.mr-btn:hover{
    background: var(--mr-primary);
    color: #07210a;
    text-decoration: none;
    box-shadow: 3px 3px 0 rgba(93,216,89,.35);
}
.mr-btn:active{transform: translate(2px, 2px); box-shadow: 1px 1px 0 rgba(93,216,89,.25)}
.mr-btn:focus-visible{outline:2px solid var(--mr-primary);outline-offset:2px}

.mr-btn-lg{padding:.85rem 1.5rem;font-size:1.02rem}

.mr-btn-primary{
    background: var(--mr-primary);
    border-color: var(--mr-primary);
    color: #07210a;
    font-weight: 700;
    box-shadow: 4px 4px 0 rgba(93,216,89,.35);
}
.mr-btn-primary:hover{
    background: var(--mr-primary-strong);
    border-color: var(--mr-primary-strong);
    color: #07210a;
    box-shadow: 4px 4px 0 rgba(93,216,89,.55);
}
.mr-btn-primary:active{box-shadow: 2px 2px 0 rgba(93,216,89,.35)}

.mr-btn-ghost{background:transparent;border-color:transparent;color:var(--mr-text-muted)}
.mr-btn-ghost:hover{background:var(--mr-surface-2);color:var(--mr-text);border-color:transparent}

.mr-btn-danger{
    color: var(--mr-danger);
    background: transparent;
    border-color: transparent;
}
.mr-btn-danger:hover{
    background: var(--mr-danger-soft);
    border-color: rgba(255,93,108,.3);
    color: var(--mr-danger);
}

.mr-btn.mr-copied{background:var(--mr-primary);border-color:var(--mr-primary);color:#07210a}

/* =============================================================
   Forms
   ============================================================= */
.mr-form .mr-field{margin-bottom: 1.1rem}
.mr-field label{
    display:block;
    font-family: var(--mr-font-mono);
    font-size: .78rem;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--mr-text-muted);
    margin-bottom: .4rem;
    font-weight: 500;
}

.mr-input,
input[type="text"].mr-input,
input[type="email"].mr-input,
input[type="number"].mr-input,
input[type="datetime-local"].mr-input,
input[type="date"].mr-input,
textarea.mr-input,
select.mr-input{
    display: block; width: 100%;
    padding: .55rem .75rem;
    border: 1px solid var(--mr-border-strong);
    font: inherit;
    font-family: var(--mr-font-mono);
    background: var(--mr-bg);
    color: var(--mr-primary);
    line-height: 1.3;
    transition: border-color .1s, box-shadow .1s;
}
.mr-input::placeholder{color:var(--mr-text-dim);font-family:var(--mr-font-mono)}
.mr-input:focus{
    outline: none;
    border-color: var(--mr-primary);
    box-shadow: inset 0 0 0 1px var(--mr-primary), 0 0 12px rgba(93,216,89,.15);
    background: var(--mr-bg);
}
.mr-input:disabled{opacity:.5;cursor:not-allowed}
.mr-input-mono{font-family:var(--mr-font-mono);font-size:.85rem}

/* native pickers in dark mode */
input[type="datetime-local"].mr-input,
input[type="date"].mr-input,
input[type="time"].mr-input{
    color-scheme: dark;
}

textarea.mr-input{resize:vertical;min-height:84px}

.mr-radio-row{display:flex;gap:.6rem;flex-wrap:wrap}
.mr-radio{
    display:inline-flex;align-items:center;gap:.55em;
    border:1px solid var(--mr-border-strong);
    border-radius:var(--mr-radius);
    padding:.55rem 1rem;
    cursor:pointer;
    background:var(--mr-bg-2);
    transition:border-color .12s,background .12s,color .12s;
}
.mr-radio:hover{border-color:#37425a}
.mr-radio:has(input:checked){
    border-color:var(--mr-primary);
    background:var(--mr-primary-soft);
    color:var(--mr-primary-strong);
    font-weight:500;
    box-shadow: 0 0 0 3px rgba(93,216,89,.10);
}
.mr-radio input{margin:0;accent-color:var(--mr-primary)}

.mr-check{
    display: inline-flex; align-items: center; gap: .55em;
    cursor: pointer;
    padding: .35rem 0;
    color: var(--mr-text);
    font-size: .92rem;
}
.mr-check input{accent-color:var(--mr-primary);width:16px;height:16px}

.mr-field-grid{
    display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
    gap:.5rem 1rem;
    margin-bottom:1rem;
    padding: 1rem 1.1rem;
    background: var(--mr-bg-2);
    border:1px solid var(--mr-border);
    border-radius:var(--mr-radius);
}

.mr-options-list{display:flex;flex-direction:column;gap:.5rem;margin-bottom:.75rem}
.mr-option-row{display:flex;gap:.5rem;align-items:center}
.mr-option-row .mr-input{flex:1}

.mr-actions{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin-top:1.25rem}
.mr-add-row{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin-top:.5rem}
.mr-add-row .mr-input{width:auto;flex:0 1 auto;min-width:180px}

.mr-advanced{
    margin: 1rem 0;
    border: 1px solid var(--mr-border);
    border-radius: var(--mr-radius);
    background: var(--mr-bg-2);
}
.mr-advanced summary{
    padding: .75rem 1.1rem;
    cursor: pointer;
    font-family: var(--mr-font-mono);
    font-size: .82rem;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--mr-text-muted);
    list-style: none;
    user-select: none;
}
.mr-advanced summary::-webkit-details-marker{display:none}
.mr-advanced summary::before{
    content:"▸ ";
    color: var(--mr-primary);
    display: inline-block;
    transition: transform .15s;
    margin-right: .35em;
}
.mr-advanced[open] summary::before{transform:rotate(90deg)}
.mr-advanced[open] summary{border-bottom:1px solid var(--mr-border);color:var(--mr-text)}
.mr-advanced-body{padding: 1rem 1.1rem .25rem}

/* =============================================================
   Flash messages
   ============================================================= */
.mr-flash{
    display: flex; gap: .65rem; align-items: flex-start;
    padding: .85rem 1.1rem;
    border-radius: var(--mr-radius);
    margin-bottom: 1rem;
    border: 1px solid transparent;
    font-size: .94rem;
    background: var(--mr-surface-2);
    border-left-width: 3px;
}
.mr-flash-ok{ border-color: rgba(93,216,89,.25); border-left-color: var(--mr-primary); color:#bbf7b0; background: rgba(93,216,89,.06)}
.mr-flash-err{border-color: rgba(255,93,108,.25); border-left-color: var(--mr-danger);  color:#ffb4bb; background: rgba(255,93,108,.06)}
.mr-flash-info{border-color: rgba(76,201,255,.25); border-left-color: var(--mr-accent); color:#bee5ff; background: rgba(76,201,255,.06)}
.mr-flash a{color:inherit;text-decoration:underline}
.mr-flash-icon{font-weight:bold;flex:none;font-family:var(--mr-font-mono)}

/* =============================================================
   Hero / home
   ============================================================= */
.mr-hero{padding: 3.5rem 1rem 2.5rem;text-align:center;position:relative}
.mr-hero-inner{max-width:760px;margin:0 auto;position:relative;z-index:1}

.mr-hero-badge{
    display: inline-flex; align-items: center; gap: .5em;
    padding: .25em .85em;
    background: transparent;
    border: 1px solid var(--mr-primary);
    color: var(--mr-primary);
    font-family: var(--mr-font-mono);
    font-size: .78rem;
    letter-spacing: .08em;
    margin-bottom: 1.25rem;
    text-transform: uppercase;
    text-shadow: 0 0 6px rgba(93,216,89,.4);
}
.mr-hero-badge::before{ content:"> "; opacity:.7 }
@keyframes mr-pulse{
    0%,100%{opacity:1}
    50%   {opacity:.55}
}

.mr-hero h1{
    font-family: var(--mr-font-logo);
    font-size: 3rem;
    letter-spacing: 0;
    margin: 0 0 1rem;
    line-height: 1.05;
    font-weight: 400;
    color: var(--mr-text);
    text-transform: lowercase;
}
.mr-hero h1 .accent{
    background: linear-gradient(120deg, var(--mr-primary-strong) 0%, var(--mr-primary) 60%, #b8f0a6 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.mr-hero-lead{
    font-size: 1.13rem;
    color: var(--mr-text-muted);
    margin: 0 0 1.75rem;
    max-width: 560px;
    margin-left: auto;
    margin-right: auto;
}
.mr-hero-cta{display:flex;flex-wrap:wrap;gap:.85rem;justify-content:center;align-items:center}
.mr-hero-hint{
    color: var(--mr-text-dim);
    font-family: var(--mr-font-mono);
    font-size: .82rem;
    letter-spacing: .03em;
}

/* stacking wrap — radar sits directly behind the wordmark */
.mr-hero-title{
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: fit-content;
    margin: 0 auto 4.75rem;
    isolation: isolate;
}
.mr-hero-title .mr-hero-logo{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    margin: 0;
    z-index: 0;
    width: clamp(120px, 40vw, 215px);
    height: clamp(120px, 40vw, 215px);
}
.mr-hero-title .title-spinner{
    width: 100%;
    height: 100%;
}
.mr-hero-title .mr-wordmark{
    position: relative;
    z-index: 1;
    margin: 0;
}

/* big two-line wordmark over the radar — Kenyan Coffee with phosphor glow */
.mr-wordmark{
    font-family: var(--mr-font-logo);
    font-weight: 400;
    font-size: clamp(3.4rem, 15vw, 7.5rem);
    line-height: .82;
    letter-spacing: .02em;
    margin: 0 0 1.5rem;
    text-align: center;
    color: var(--mr-text);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
    text-transform: lowercase;
    animation: crt-flicker 6s infinite;
}
.mr-wordmark span{display:block}
.mr-wordmark span:first-child{
    color: #fff;
    text-shadow:
        0 0 4px rgba(255,255,255,.5),
        0 0 14px rgba(93,216,89,.15);
}
.mr-wordmark span:last-child{
    color: var(--mr-primary);
    text-shadow:
        0 0 6px rgba(93,216,89,.65),
        0 0 18px rgba(93,216,89,.45),
        0 0 36px rgba(93,216,89,.25);
}
@keyframes crt-flicker{
    0%, 95%, 100% { opacity: 1; }
    96%           { opacity: .85; }
    97%           { opacity: 1; }
    98%           { opacity: .92; }
}

/* hero logo container — sized like the spinner so the absolute child fits */
.mr-hero-logo{
    position: relative;
    width: clamp(120px, 45vw, 200px);
    height: clamp(120px, 45vw, 200px);
    margin: 0 auto 1.5rem;
}

/* user-defined spinner shape — verbatim */
.title-spinner {
    position: absolute;
    width: clamp(120px, 45vw, 200px);
    height: clamp(120px, 45vw, 200px);
    background: conic-gradient(transparent 0deg 270deg, #5dd859 370deg 360deg);
    border-radius: 50%;
    animation: spin-slow 8s linear infinite;
    z-index: 1;
    opacity: 0.4;
}
@keyframes spin-slow {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}

/* same shape, smaller — sits inside the header brand mark */
.mr-brand-spinner{
    position: relative;
    width: 22px;
    height: 22px;
    flex: none;
    border-radius: 50%;
    background: conic-gradient(transparent 0deg 270deg, #5dd859 370deg 360deg);
    animation: spin-slow 8s linear infinite;
    opacity: 0.85;
}

/* feature tiles */
.mr-features{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
    margin: .5rem 0 1.5rem;
}
.mr-feature{
    background: var(--mr-surface);
    border: 1px solid var(--mr-border-strong);
    padding: 1.25rem 1.25rem 1rem;
    transition: border-color .12s, box-shadow .12s, transform .12s;
    position: relative;
    overflow: hidden;
    box-shadow: 3px 3px 0 rgba(0,0,0,.4);
}
.mr-feature:hover{
    border-color: var(--mr-primary);
    transform: translate(-1px,-1px);
    box-shadow: 5px 5px 0 rgba(93,216,89,.20);
}
.mr-feature-icon{
    font-family: var(--mr-font-mono);
    font-size: .78rem;
    color: var(--mr-primary);
    text-transform: uppercase;
    letter-spacing: .12em;
    margin-bottom: .5rem;
    display: inline-block;
    text-shadow: 0 0 6px rgba(93,216,89,.4);
}
.mr-feature-icon::before{content:"> "}
.mr-feature h3{
    font-family: var(--mr-font-logo);
    text-transform: lowercase;
    font-weight: 400;
    font-size: 1.4rem;
    letter-spacing: .01em;
    margin: .2rem 0 .35rem;
}
.mr-feature p{margin:0;color:var(--mr-text-muted);font-size:.92rem}

.mr-howto h2{font-size:.85rem}
.mr-steps{
    padding: 0;
    margin: .5rem 0 1rem;
    list-style: none;
    counter-reset: step;
}
.mr-steps li{
    margin-bottom: .65rem;
    padding-left: 2.4rem;
    position: relative;
    counter-increment: step;
}
.mr-steps li::before{
    content: counter(step, decimal-leading-zero);
    position: absolute; left: 0; top: -1px;
    font-family: var(--mr-font-mono);
    font-size: .8rem;
    color: var(--mr-primary);
    background: var(--mr-primary-soft);
    border: 1px solid rgba(93,216,89,.25);
    padding: .2em .5em;
    border-radius: var(--mr-radius-sm);
}
.mr-cta-row{margin:1.25rem 0 .25rem}

/* =============================================================
   Vote page
   ============================================================= */
.mr-vote-header{display:flex;flex-wrap:wrap;gap:1rem;align-items:flex-start;justify-content:space-between}
.mr-vote-header-main{flex:1;min-width:240px}
.mr-vote-desc{color:var(--mr-text-muted);margin-top:.5rem}

.mr-badges{display:flex;gap:.4rem;flex-wrap:wrap;align-items:center}
.mr-badge{
    display: inline-flex; align-items: center; gap: .3em;
    padding: .15em .55em;
    font-family: var(--mr-font-mono);
    font-size: .72rem;
    letter-spacing: .06em;
    text-transform: uppercase;
    background: transparent;
    color: var(--mr-text-muted);
    border: 1px solid var(--mr-border-strong);
    white-space: nowrap;
}
.mr-badge::before{content:"["}
.mr-badge::after {content:"]"}
.mr-badge.open    { color: var(--mr-primary); border-color: var(--mr-primary); text-shadow: 0 0 6px rgba(93,216,89,.5) }
.mr-badge.closed  { color: var(--mr-danger); border-color: var(--mr-danger) }
.mr-badge.deadline{ color: var(--mr-accent); border-color: var(--mr-accent) }
.mr-badge.count   { color: var(--mr-text); border-color: var(--mr-border-strong) }

.mr-empty{text-align:center;padding:1.75rem 1rem;color:var(--mr-text-muted)}
.mr-empty-icon{
    font-family:var(--mr-font-mono);
    font-size:.85rem;
    color:var(--mr-primary);
    display:block;margin-bottom:.5rem;
    letter-spacing:.1em;
    text-transform:uppercase;
}
.mr-empty-icon::before{content:"// "}

/* Voting table */
.mr-table-wrap{
    overflow-x: auto;
    border: 1px solid var(--mr-border);
    border-radius: var(--mr-radius);
    background: var(--mr-bg-2);
    -webkit-overflow-scrolling: touch;
}
.mr-table{
    width: 100%; border-collapse: separate; border-spacing: 0;
    font-size: .92rem; min-width: 520px;
}
.mr-table th, .mr-table td{
    padding: .7rem .55rem;
    text-align: center;
    vertical-align: middle;
    border-bottom: 1px solid var(--mr-border);
    position: relative;
}
.mr-table tr:last-child td{border-bottom:0}
.mr-table th.mr-name, .mr-table td.mr-name{
    text-align: left;
    min-width: 160px;
    position: sticky; left: 0;
    background: var(--mr-bg-2); z-index: 1;
    border-right: 1px solid var(--mr-border);
    font-weight: 500;
}
.mr-table thead th{
    background: var(--mr-surface);
    font-family: var(--mr-font-mono);
    font-weight: 500;
    color: var(--mr-text-muted);
    font-size: .82rem;
    letter-spacing: .04em;
}
.mr-table thead th.mr-name{z-index:3;background:var(--mr-surface);text-transform:uppercase}
.mr-table thead th.mr-date-head{
    background: var(--mr-surface-2);
    border-bottom: 1px solid var(--mr-border);
    padding: .55rem .35rem;
}
.mr-table thead th.mr-date-head + .mr-date-head{border-left:2px solid var(--mr-border-strong)}
.mr-table thead th.mr-time-head{background:var(--mr-surface);padding:.4rem .35rem}
.mr-table thead th.mr-time-head .time{
    font-size: .92rem;
    font-weight: 600;
    color: var(--mr-primary);
    font-family: var(--mr-font-mono);
}
.mr-table .mr-group-start{border-left:2px solid var(--mr-border-strong)}

.mr-opt-date{
    display:flex;flex-direction:column;align-items:center;line-height:1.15;gap:1px;
    font-family: var(--mr-font-mono);
}
.mr-opt-date .day  {font-size:.66rem;text-transform:uppercase;color:var(--mr-text-muted);letter-spacing:.06em}
.mr-opt-date .num  {font-size:1.2rem;font-weight:700;color:var(--mr-text)}
.mr-opt-date .month{font-size:.66rem;color:var(--mr-text-muted);text-transform:uppercase;letter-spacing:.06em}
.mr-opt-text{font-weight:600;font-size:.9rem}

.mr-cap{
    display: block; margin-top: .25rem;
    font-family: var(--mr-font-mono);
    font-size: .68rem;
    color: var(--mr-text-dim);
    letter-spacing: .04em;
}
.mr-cap.full{color:var(--mr-danger);font-weight:600}

.mr-table tbody tr:hover td{background:var(--mr-surface)}
.mr-table tbody tr:hover td.mr-name{background:var(--mr-surface)}
.mr-table td.mr-best{
    background: var(--mr-best);
    box-shadow: inset 0 0 0 1px rgba(93,216,89,.18);
}

.mr-cell{
    display: inline-flex;
    width: 28px; height: 28px;
    align-items: center; justify-content: center;
    font-weight: 700; font-size: .95rem;
    font-family: var(--mr-font-mono);
    border-radius: 0;
}
.mr-cell.yes  {background:var(--mr-yes-soft);   color:var(--mr-yes);   border:1px solid rgba(93,216,89,.3)}
.mr-cell.maybe{background:var(--mr-maybe-soft); color:var(--mr-maybe); border:1px solid rgba(247,185,85,.3)}
.mr-cell.no   {background:var(--mr-no-soft);    color:var(--mr-no);    border:1px solid rgba(90,101,115,.3)}

.mr-totals td{
    background: var(--mr-surface) !important;
    font-weight: 700;
    border-top: 2px solid var(--mr-primary);
    font-family: var(--mr-font-mono);
    font-size: .95rem;
}
.mr-totals + .mr-totals td{border-top:1px solid var(--mr-border)}
.mr-totals td.mr-best{background:var(--mr-best) !important;color:var(--mr-primary)}
.mr-totals td.mr-name{color:var(--mr-text-muted);font-weight:500;letter-spacing:.06em;text-transform:uppercase;font-size:.78rem}

.mr-me-row td, .mr-me-row td.mr-name{
    background: rgba(76,201,255,.06) !important;
    box-shadow: inset 2px 0 0 var(--mr-accent);
}
.mr-me-tag{
    display: inline-block;
    margin-left: .5em;
    padding: .05em .55em;
    font-family: var(--mr-font-mono);
    font-size: .68rem; font-weight: 600;
    color: var(--mr-accent);
    background: rgba(76,201,255,.1);
    border: 1px solid rgba(76,201,255,.3);
    border-radius: 4px;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.mr-vote-row td{
    background: rgba(247,185,85,.04);
    border-top: 1px dashed rgba(247,185,85,.4);
}
.mr-vote-row td.mr-name{background:rgba(247,185,85,.04)}
.mr-vote-cell{padding:.45rem .35rem !important}

.mr-vote-group{
    position: relative;
    display: inline-flex;
    border-radius: var(--mr-radius);
    overflow: hidden;
    border: 1px solid var(--mr-border-strong);
    background: var(--mr-bg);
}
.mr-vote-group label{
    padding: .35rem .65rem;
    cursor: pointer;
    font-family: var(--mr-font-mono);
    font-size: .95rem; font-weight: 700;
    color: var(--mr-text-muted);
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 34px;
    transition: background .12s, color .12s;
    border-left: 1px solid var(--mr-border-strong);
    user-select: none;
}
.mr-vote-group label:first-of-type{border-left:0}
.mr-vote-group input{position:absolute;opacity:0;pointer-events:none}
.mr-vote-group label.is-yes:has(input:checked)  {background:var(--mr-yes);  color:#07210a}
.mr-vote-group label.is-maybe:has(input:checked){background:var(--mr-maybe);color:#1a0f00}
.mr-vote-group label.is-no:has(input:checked)   {background:var(--mr-no);  color:var(--mr-text)}
.mr-vote-group label:has(input:disabled){opacity:.35;cursor:not-allowed}
.mr-vote-group label:focus-within{outline:2px solid var(--mr-primary);outline-offset:1px;z-index:1}

/* =============================================================
   Share & boxes
   ============================================================= */
.mr-share-row{display:flex;gap:.5rem;align-items:stretch;flex-wrap:wrap}
.mr-share-row .mr-input{flex:1;min-width:200px;font-family:var(--mr-font-mono);font-size:.85rem}
.mr-share-box{margin-top:1rem}
.mr-share-box label{
    display: block; font-weight: 500; margin-bottom: .35rem;
    font-family: var(--mr-font-mono); font-size: .78rem;
    text-transform: uppercase; letter-spacing: .08em;
    color: var(--mr-text-muted);
}
.mr-pill{
    display: inline-block;
    padding: .1em .55em;
    font-family: var(--mr-font-mono);
    font-size: .65rem; font-weight: 600;
    border-radius: 3px;
    background: var(--mr-primary-soft);
    color: var(--mr-primary-strong);
    border: 1px solid rgba(93,216,89,.3);
    text-transform: uppercase;
    letter-spacing: .08em;
    margin-left: .35em;
    vertical-align: 1px;
}
.mr-pill-warn{
    background: rgba(247,185,85,.10);
    color: var(--mr-maybe);
    border-color: rgba(247,185,85,.3);
}

/* Comments */
.mr-comment{
    padding: .8rem .95rem;
    border: 1px solid var(--mr-border);
    border-left: 3px solid var(--mr-primary);
    border-radius: var(--mr-radius);
    margin-bottom: .55rem;
    background: var(--mr-bg-2);
}
.mr-comment-meta{
    font-family: var(--mr-font-mono);
    font-size: .76rem;
    color: var(--mr-text-muted);
    margin-bottom: .35rem;
    letter-spacing: .03em;
}
.mr-comment-form{display:flex;flex-direction:column;gap:.5rem;margin-top:.85rem}

/* admin tables */
.mr-list-table{width:100%;border-collapse:collapse;font-size:.92rem;margin:.25rem 0 1rem}
.mr-list-table th, .mr-list-table td{
    padding: .6rem .55rem;
    text-align: left;
    border-bottom: 1px solid var(--mr-border);
    vertical-align: middle;
}
.mr-list-table thead th{
    font-family: var(--mr-font-mono);
    font-size: .78rem;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--mr-text-muted);
    background: var(--mr-bg-2);
    font-weight: 500;
}
.mr-list-table tbody tr:hover{background:rgba(255,255,255,.015)}

.mr-admin-head{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:1rem}

.mr-fresh{
    border: 1px solid rgba(93,216,89,.3);
    background:
        radial-gradient(600px 200px at 100% 0%, rgba(93,216,89,.08), transparent 60%),
        linear-gradient(180deg, var(--mr-surface) 0%, var(--mr-surface-2) 100%);
}

/* Owner banner on the public poll page */
.mr-owner-banner{
    border-color: var(--mr-primary);
    box-shadow: 4px 4px 0 rgba(93,216,89,.25);
    background:
        radial-gradient(600px 200px at 100% 0%, rgba(93,216,89,.08), transparent 65%),
        var(--mr-surface);
}
.mr-owner-banner-head{
    display:flex; gap:.6rem; align-items:flex-start;
    margin-bottom: 1rem;
    flex-wrap: wrap;
}
.mr-owner-tag{
    font-family: var(--mr-font-mono);
    font-size: .72rem;
    color: var(--mr-primary);
    border: 1px solid var(--mr-primary);
    padding: .15em .55em;
    letter-spacing: .08em;
    text-transform: uppercase;
    text-shadow: 0 0 6px rgba(93,216,89,.5);
    flex: none;
}
.mr-owner-banner-grid{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 1rem;
    margin-bottom: 1rem;
}
.mr-owner-banner-grid .mr-share-box{margin:0}
.mr-owner-banner-cta{
    display: flex; justify-content: flex-end;
    border-top: 1px solid var(--mr-border-strong);
    padding-top: 1rem;
}
.mr-fresh::before{
    content:"";
    position:absolute;top:0;left:0;right:0;height:2px;
    background: linear-gradient(90deg, transparent, var(--mr-primary), transparent);
}
.mr-danger-zone{
    border: 1px solid rgba(255,93,108,.25);
    background:
        radial-gradient(400px 160px at 100% 0%, rgba(255,93,108,.06), transparent 60%),
        linear-gradient(180deg, var(--mr-surface) 0%, var(--mr-surface-2) 100%);
}
.mr-danger-zone h2::before{background:var(--mr-danger);box-shadow:0 0 8px rgba(255,93,108,.5)}

/* =============================================================
   Mobile
   ============================================================= */
@media (max-width: 640px){
    body{font-size:14.5px}
    .mr-container{padding:1rem .75rem}
    .mr-card{padding:1.1rem 1.1rem}
    .mr-hero{padding:2.25rem .5rem 1.5rem}
    .mr-hero h1{font-size:2.1rem}
    .mr-hero-lead{font-size:1rem}
    .mr-radar{width:380px;height:380px}
    .mr-card h1{font-size:1.3rem}
    .mr-table{font-size:.85rem;min-width:480px}
    .mr-table th,.mr-table td{padding:.5rem .35rem}
    .mr-vote-group label{padding:.3rem .4rem;min-width:30px;font-size:.9rem}
    .mr-cell{width:26px;height:26px;font-size:.85rem}
    .mr-admin-head{flex-direction:column;align-items:stretch}
    .mr-brand-text{display:none}
}

/* prefers-reduced-motion */
@media (prefers-reduced-motion: reduce){
    .title-spinner, .mr-wordmark{ animation: none !important; }
    *{transition:none !important}
}

/* let the body sit above the scanlines for nicer feel on cards */
.mr-card, .mr-feature, .mr-btn{ isolation: isolate; }