/* Project 100K. Everything is scoped under .p100k so the WordPress theme stays untouched. */

@font-face{font-family:"P100K Text";src:url(fonts/poppins-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"P100K Text";src:url(fonts/poppins-600.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"P100K Digits";src:url(fonts/vt323-400.woff2) format("woff2");font-weight:400;font-display:swap}

.p100k{
  --bg:#f5f6fa; --panel:#ffffff; --ink:#14244a; --ink-2:#4a5677; --ink-3:#8a93ab;
  --line:#dfe3ee; --pink:#e84793; --track:#e9ecf4;
  --tape:#e4e7ef; --tape-fill:var(--pink); --tape-edge:rgba(0,0,0,.1);
}
.p100k[data-theme="dark"]{--tape:#2a3556; --tape-edge:rgba(0,0,0,.3)}
.p100k[data-theme="dark"]{
  --bg:#0d1428; --panel:#141d36; --ink:#eef1fa; --ink-2:#b6bfd8; --ink-3:#7c87a6;
  --line:#26314f; --track:#202a48;
  color-scheme:dark;
}
@media (prefers-color-scheme:dark){
  .p100k[data-theme="auto"]{
    --bg:#0d1428; --panel:#141d36; --ink:#eef1fa; --ink-2:#b6bfd8; --ink-3:#7c87a6;
    --line:#26314f; --track:#202a48;
    color-scheme:dark;
  }
}

.p100k,.p100k *{box-sizing:border-box}
.p100k{background:var(--bg);color:var(--ink);font-family:"P100K Text",Poppins,system-ui,sans-serif;font-size:15px;line-height:1.5;padding:clamp(12px,3vw,20px);border-radius:8px;margin:1.5em 0;max-width:100%;overflow:hidden}
.p100k p{margin:0}
.p100k-head{margin-bottom:18px}
.p100k-logo{display:block;width:150px;max-width:50%;height:auto;margin:0 0 10px}
.p100k .p100k-title{font:600 clamp(26px,4.5vw,38px)/1.1 "P100K Text",Poppins,system-ui,sans-serif;margin:0;padding:0;color:var(--ink);letter-spacing:-.01em;text-wrap:balance;border:0;text-transform:none}
.p100k-lede{color:var(--ink-2);max-width:52ch;margin-top:10px!important}

.p100k-side{display:flex;flex-direction:column;gap:14px}
.p100k-card{min-width:0;background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:16px}
.p100k-label{font-weight:600;font-size:11.5px;line-height:1;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);margin-bottom:8px!important}
.p100k-big{font:400 clamp(56px,9vw,80px)/.85 "P100K Digits",ui-monospace,monospace;font-variant-numeric:tabular-nums}
.p100k-big small{font-size:.38em;color:var(--ink-3);margin-left:6px}
.p100k-stats{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.p100k-num{font:400 42px/.9 "P100K Digits",ui-monospace,monospace;font-variant-numeric:tabular-nums}
.p100k-of{color:var(--ink-3);font-size:13px;margin-top:4px}

.p100k-tape{position:relative;height:46px;margin-top:8px}
.p100k-tape-body{position:absolute;inset:0 0 16px 0;background:var(--tape);border-radius:3px;overflow:hidden;box-shadow:inset 0 -2px 0 var(--tape-edge)}
.p100k-tape-fill{position:absolute;inset:0 auto 0 0;background:var(--tape-fill);width:0}
.p100k-tape svg{position:absolute;left:0;top:0;width:100%;height:30px}
.p100k-tape-lbls{position:absolute;left:0;right:0;bottom:0;height:14px;font-weight:600;font-size:10.5px;line-height:14px;color:var(--ink-3);font-variant-numeric:tabular-nums}
.p100k-tape-lbls span{position:absolute;transform:translateX(-50%)}
.p100k-tape-lbls span:first-child{transform:none}
.p100k-tape-lbls span:last-child{transform:translateX(-100%)}
.p100k-done{display:none;font-weight:600;font-size:15px;line-height:1.2;color:var(--pink);margin-top:8px}
.p100k-done.show{display:block}
.p100k-note{color:var(--ink-3);font-size:12.5px;margin-top:10px!important}

.p100k input[type=range]{width:100%;accent-color:var(--pink);margin:6px 0 8px;height:28px;padding:0;border:0;background:none}
.p100k-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.p100k .p100k-btn{font:600 13px/1 "P100K Text",Poppins,system-ui,sans-serif;color:var(--ink);background:transparent;border:1px solid var(--line);border-radius:4px;padding:8px 10px;cursor:pointer;text-transform:none;letter-spacing:0;box-shadow:none;min-height:0}
.p100k .p100k-btn:hover{border-color:var(--pink);color:var(--pink);background:transparent}
.p100k .p100k-btn:focus-visible,.p100k input:focus-visible{outline:2px solid var(--pink);outline-offset:2px}
.p100k input[type=number]{font:400 22px/1 "P100K Digits",monospace;width:6.5em;padding:6px 8px;border:1px solid var(--line);border-radius:4px;background:var(--bg);color:var(--ink);font-variant-numeric:tabular-nums;margin:0}