/* OSP Oracle — coaching app. Purple throughout. Dark default + light toggle. */
:root{
  --accent:#a855c9; --accent-d:#7a3a98; --accent-l:#cf9ae8; --accent-bg:rgba(168,85,201,0.14);
  --bg:#0f0c12; --surface:#150f1a; --card:#1a1320; --border:#2c2433; --border-2:#3a3043;
  --text:#ece6f1; --muted:#8a7e93; --turf:#241a2b; --turf-line:#5a4d66; --bunker:#cabbd6; --bunker-line:#9784a6;
  --win:#7bc47b; --loss:#e2566f;
}
[data-theme="light"]{
  --accent:#8a39ab; --accent-d:#a855c9; --accent-l:#7a2f97; --accent-bg:rgba(138,57,171,0.10);
  --bg:#f5f1f7; --surface:#fff; --card:#fff; --border:#e3dbe9; --border-2:#d2c6da;
  --text:#241a2b; --muted:#776b82; --turf:#efe7f4; --turf-line:#c7b6d4; --bunker:#b79cc9; --bunker-line:#9784a6;
}
*{box-sizing:border-box}
html,body{margin:0}
body{
  background:var(--bg); color:var(--text); font-size:14px; line-height:1.5;
  font-family:"Helvetica Neue",-apple-system,BlinkMacSystemFont,Arial,sans-serif;
}
a{color:inherit;text-decoration:none}

/* Header */
header{display:flex;align-items:center;justify-content:space-between;padding:12px 20px;background:var(--surface);border-bottom:1px solid var(--border)}
header h1{margin:0;line-height:0}
.brand-logo{height:34px;width:auto;display:block}
.header-right{display:flex;align-items:center;gap:14px}
.header-right .date{font-size:12px;color:var(--muted)}
.tagline{font-size:12px;color:var(--muted);letter-spacing:1px}
.theme-toggle{background:transparent;border:1px solid var(--border-2);color:var(--text);border-radius:8px;width:32px;height:32px;cursor:pointer;font-size:14px}

/* Nav */
nav{display:flex;gap:4px;flex-wrap:wrap;padding:8px 16px;background:var(--surface);border-bottom:1px solid var(--border)}
nav a{font-size:13px;padding:7px 14px;border-radius:999px;color:var(--muted);border:1px solid transparent}
nav a:hover{color:var(--text);background:var(--accent-bg)}
nav a.active{color:var(--accent-l);background:var(--accent-bg);border-color:var(--accent-d)}

/* Layout */
main{max-width:980px;margin:0 auto;padding:22px 20px 60px}
.intro{font-size:14px;color:var(--muted);line-height:1.6;margin:0 0 20px}
.intro b{color:var(--text);font-weight:500}
.section-label{font-size:11px;letter-spacing:1.5px;color:var(--accent);margin:24px 0 10px}
h2.page-title{font-size:22px;font-weight:500;margin:0 0 4px}
.page-sub{font-size:13px;color:var(--muted);margin:0 0 18px}

/* Tiles (dashboard rooms) */
.tiles{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.tile{display:block;border:1px solid var(--border);border-radius:14px;padding:16px;background:var(--surface);transition:border-color .12s}
.tile:hover{border-color:var(--accent-d);background:var(--accent-bg)}
.tile.full{grid-column:1 / -1}
.tile .ic{font-size:24px;color:var(--accent-l)}
.tile .t{font-size:15px;font-weight:500;margin-top:10px}
.tile .d{font-size:12px;color:var(--muted);line-height:1.55;margin-top:4px}
.tile.coming{border-style:dashed;background:transparent}
.tile.coming .ic,.tile.coming .t{color:var(--muted)}

/* Cards / list rows */
.card{border:1px solid var(--border);border-radius:12px;padding:14px 16px;background:var(--surface);margin-bottom:10px}
.row{display:flex;align-items:center;justify-content:space-between;gap:12px}
.row .sub{font-size:12px;color:var(--muted);margin-top:3px}
.row .name{font-size:14px;font-weight:500}

/* Badge / chips */
.chip{font-size:11px;padding:4px 11px;border-radius:999px;white-space:nowrap;border:1px solid var(--border-2);color:var(--muted)}
.chip.accent{color:var(--accent-l);background:var(--accent-bg);border-color:var(--accent-d)}
.chips{display:flex;gap:7px;flex-wrap:wrap}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:7px;font-size:13px;padding:10px 16px;border-radius:10px;border:1px solid var(--border-2);background:transparent;color:var(--text);cursor:pointer;font-family:inherit}
.btn:hover{background:var(--accent-bg)}
.btn.primary{background:var(--accent);color:#fff;border-color:var(--accent)}
.btn.primary:hover{background:var(--accent-d)}
.btn.block{width:100%;justify-content:center}
.btn-row{display:flex;gap:8px;margin-top:16px}

/* Field svg */
.field{width:100%;display:block;border-radius:12px;background:var(--turf)}
.field-wrap{border:1px solid var(--border);border-radius:14px;padding:8px;background:var(--card)}

/* Toolbar */
.toolbar{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:12px}
.tool{display:flex;flex-direction:column;align-items:center;gap:3px;min-width:54px;padding:8px 9px;border-radius:9px;border:1px solid var(--border);background:var(--surface);color:var(--muted);cursor:pointer;font-size:10px}
.tool:hover{color:var(--text)}
.tool.on{color:var(--accent-l);background:var(--accent-bg);border-color:var(--accent-d)}
.tool .ti{font-size:18px}

/* Steps / lists */
ol.steps,ul.points{margin:0;padding-left:18px;line-height:1.7;font-size:13px;color:var(--text)}
.block-label{font-size:11px;letter-spacing:1px;color:var(--accent-l);margin:14px 0 6px}

/* Avatar */
.avatar{width:34px;height:34px;border-radius:50%;background:var(--accent-bg);border:1px solid var(--accent-d);color:var(--accent-l);display:inline-flex;align-items:center;justify-content:center;font-size:13px;font-weight:500}

/* Footer */
footer{display:flex;flex-direction:column;align-items:center;gap:6px;padding:30px 20px;border-top:1px solid var(--border);margin-top:20px}
.footer-crest{height:64px;width:auto;opacity:.9}
.footer-brand{font-size:13px;color:var(--text);letter-spacing:1px}
.footer-copy{font-size:11px;color:var(--muted)}

/* About page rows */
.room{display:flex;gap:12px;padding:11px 0;border-bottom:1px solid var(--border)}
.room:first-child{padding-top:0}
.room:last-child{border-bottom:none;padding-bottom:0}
.room>i{font-size:22px;color:var(--accent-l);flex-shrink:0;margin-top:1px}
.room b{display:block;font-size:14px;font-weight:500;margin-bottom:2px}
.room span{display:block;font-size:13px;color:var(--muted);line-height:1.55}

/* Forms (drill editor) */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:6px}
.fld{display:flex;flex-direction:column;gap:4px}
.fld span{font-size:11px;letter-spacing:.5px;color:var(--muted)}
input[type=text],textarea{width:100%;background:var(--surface);border:1px solid var(--border-2);border-radius:9px;color:var(--text);font-family:inherit;font-size:14px;padding:10px 12px}
textarea{margin-bottom:6px;resize:vertical;line-height:1.6}
input[type=text]:focus,textarea:focus{outline:none;border-color:var(--accent)}

@media (max-width:640px){.tiles{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}}

/* Print — clean drill/play card on white paper */
@media print{
  :root{--bg:#fff;--surface:#fff;--card:#fff;--text:#141014;--muted:#555;--border:#ccc;--border-2:#bbb;
    --turf:#f1ebf5;--turf-line:#c9b6d4;--bunker:#ddd5e4;--bunker-line:#9784a6;--accent:#8a39ab;--accent-l:#6d2e88;--accent-bg:#f3e9f7}
  header,nav,footer,.no-print{display:none!important}
  main{padding:0;max-width:100%}
  body{background:#fff}
  .field-wrap{border:1px solid #ccc;break-inside:avoid}
  .chip{border-color:#bbb}
}