/* App Kingdom Dev HQ. The first part is the dashboard's original stylesheet, unchanged. */
:root{--bg:#f6f5f2;--card:#fff;--ink:#1d1d1b;--mute:#6b6a64;--line:#e4e1d9;--accent:#7a5c12;--accent-ink:#fff;--p3:#5b6b7a;--ok:#1b6e3c;--warn:#a15c00;--bad:#b3261e;--info:#2a5db0;--note:#fff4c2;}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#15140f;--card:#201f19;--ink:#f1efe8;--mute:#a09d92;--line:#37352c;--accent:#d9b25a;--accent-ink:#1d1a0f;--p3:#9fb3c8;--ok:#6fcf97;--warn:#ffb74d;--bad:#ff8a80;--info:#8ab4f8;--note:#3a3320;}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
header,main{max-width:1180px;margin:0 auto;padding:0 16px}
header{padding-top:20px;padding-bottom:10px;display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap}
h1{font-size:22px;margin:0 0 2px}
h3{margin:0}
.sub{color:var(--mute);font-size:13px}
.tools{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
input.search{width:min(320px,100%)}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(310px,1fr));gap:12px}
.card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:8px}
.tile-top{display:flex;gap:12px;align-items:center}
.ring{width:84px;height:84px;flex:none}
.ring text{font:700 19px system-ui,sans-serif;fill:var(--ink)}
.badge{display:inline-block;font-size:11px;border:1px solid var(--line);border-radius:99px;padding:1px 8px;color:var(--mute);white-space:nowrap}
.row{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.mute{color:var(--mute);font-size:13px}
.warnbox{border:1px dashed var(--warn);color:var(--warn);border-radius:8px;padding:5px 8px;font-size:12px}
.banner{border:1px solid var(--warn);color:var(--warn);border-radius:8px;padding:8px 10px;font-size:13px;margin-bottom:10px}
button,.btn{font:inherit;font-size:13px;border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:8px;padding:6px 10px;cursor:pointer;text-decoration:none;display:inline-block}
button:hover,.btn:hover{border-color:var(--accent)}
button.primary{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
button.small{font-size:12px;padding:3px 8px}
button.icon{font-size:14px;padding:1px 6px;line-height:1.4;position:relative}
button.icon.has{background:var(--note);border-color:var(--warn)}
button.link{border:0;background:none;padding:0 2px;color:var(--info);font-size:12px;text-decoration:underline}
button:disabled{opacity:.45;cursor:not-allowed}
:focus-visible{outline:2px solid var(--info);outline-offset:2px}
.st{font-size:11px;border-radius:6px;padding:1px 6px;border:1px solid currentColor;white-space:nowrap}
.ss-COMPLETE{color:var(--ok)}.ss-IN_PROGRESS{color:var(--info)}.ss-NOT_STARTED{color:var(--mute)}.ss-NOT_APPLICABLE{color:var(--p3)}
.commit{font-size:13px;margin:2px 0}
code{font-family:ui-monospace,Consolas,monospace;font-size:12px}
dialog{max-width:900px;width:calc(100% - 24px);max-height:92vh;border:1px solid var(--line);border-radius:12px;background:var(--card);color:var(--ink);padding:16px}
dialog::backdrop{background:rgba(0,0,0,.45)}
#dlg2{max-width:760px}
#toast{position:fixed;bottom:16px;left:50%;transform:translateX(-50%);background:var(--ink);color:var(--bg);padding:8px 14px;border-radius:8px;font-size:13px;opacity:0;pointer-events:none;transition:opacity .2s;max-width:90%;z-index:10}
#toast.on{opacity:1}
ul.ac{margin:4px 0 8px 18px;padding:0}
details.step{border:1px solid var(--line);border-radius:10px;margin:6px 0;background:var(--card)}
details.step.cur{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
details.step.s-COMPLETE{background:#d8f0e0;background:color-mix(in srgb,var(--ok) 20%,var(--card));border-color:var(--ok)}
details.step>summary{cursor:pointer;padding:6px 10px;display:flex;gap:6px;align-items:center;flex-wrap:wrap}
details.step .body{padding:2px 12px 10px;font-size:13px}
.num{display:inline-block;min-width:22px;font-weight:700;color:var(--mute)}
button.markbtn{border:0;background:transparent;padding:0 2px;font-size:20px;font-weight:800;line-height:1;width:28px;border-radius:6px}
button.markbtn.sm{font-size:16px;width:22px}
button.markbtn.yes{color:var(--ok)}button.markbtn.no{color:var(--bad)}button.markbtn.na{color:var(--p3)}
.grow{flex:1 1 200px}
.lock{font-size:11px;color:var(--warn)}
.sect{margin-top:8px}
.sect>b{font-size:12px;color:var(--mute);text-transform:uppercase;letter-spacing:.04em}
form.evid{display:grid;gap:6px;margin-top:8px;padding:8px;border:1px dashed var(--accent);border-radius:8px}
form.evid label,.panel label{font-size:12px;color:var(--mute)}
select,input[type=text],input[type=search],textarea{font:inherit;font-size:13px;padding:6px 8px;border-radius:8px;border:1px solid var(--line);background:var(--card);color:var(--ink);width:100%}
textarea{resize:vertical;min-height:44px}
.notes{margin:6px 0;padding:8px;border-radius:8px;background:var(--note);border:1px solid var(--line);display:grid;gap:6px}
.notes textarea{background:var(--card)}
.subrow{display:flex;gap:6px;align-items:center;flex-wrap:wrap;padding:3px 0;border-top:1px solid var(--line)}
.subrow:first-of-type{border-top:0}
.subtitle{flex:1 1 180px;cursor:pointer}
.subtitle.done{text-decoration:line-through;color:var(--mute)}
.panel{margin:2px 0 8px 28px;padding:8px;border:1px solid var(--line);border-radius:8px;display:grid;gap:6px}
.conv{display:flex;gap:6px;align-items:center;flex-wrap:wrap;font-size:13px}
.conv a{font-weight:600}
.star{border:0;background:none;padding:0 2px;font-size:15px;color:var(--warn);cursor:pointer}
.addrow{display:flex;gap:6px;margin-top:4px}
.addrow input{flex:1}
#results{max-width:1180px;margin:0 auto 12px;padding:0 16px}
#results .list{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:6px}
.hit{display:block;width:100%;text-align:left;border:0;border-bottom:1px solid var(--line);border-radius:0;padding:6px 8px}
.hit:last-child{border-bottom:0}
.hit mark{background:var(--note);color:inherit}
.conn{font-size:12px}
.conn.off{color:var(--bad)}
.conn.on{color:var(--ok)}
pre.prompt{white-space:pre-wrap}
footer{max-width:1180px;margin:30px auto;padding:0 16px;color:var(--mute);font-size:12px}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* ---- PWA additions: Save / Sync, conflicts, installable app, phone layout ---- */
:root[data-theme="dark"]{--bg:#15140f;--card:#201f19;--ink:#f1efe8;--mute:#a09d92;--line:#37352c;--accent:#d9b25a;--accent-ink:#1d1a0f;--p3:#9fb3c8;--ok:#6fcf97;--warn:#ffb74d;--bad:#ff8a80;--info:#8ab4f8;--note:#3a3320;}
html{-webkit-text-size-adjust:100%}
header{padding-top:max(14px,env(safe-area-inset-top))}
.tools{justify-content:flex-end}
button.drive{font-weight:600;padding:8px 14px}
.conn{display:inline-block;margin-top:2px}
.banner{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.welcome{max-width:560px}
.welcome input{max-width:320px}
table.cmp{border-collapse:collapse;width:100%;font-size:13px;margin:6px 0}
table.cmp th,table.cmp td{border:1px solid var(--line);padding:4px 6px;text-align:left;vertical-align:top;white-space:pre-wrap;word-break:break-word}
table.cmp th{color:var(--mute);font-weight:600}
label.choice{display:inline-flex;gap:4px;align-items:center;font-size:13px;margin-right:12px;cursor:pointer}
.conflict{border-color:var(--warn)}
@media (max-width:640px){
  body{font-size:16px}
  header{padding-left:12px;padding-right:12px}
  header>div:first-child{width:100%}
  .tools{width:100%;justify-content:stretch}
  .tools input.search{width:100%;order:2}
  #hdrBtns{width:100%;display:grid;grid-template-columns:1fr 1fr;gap:6px}
  #hdrBtns button{width:100%}
  #hdrBtns #moreBtn{grid-column:1 / -1}
  main{padding:0 12px}
  .cards{grid-template-columns:1fr}
  button,.btn{min-height:40px}
  button.small{min-height:36px;font-size:13px;padding:6px 10px}
  button.icon{min-height:36px;min-width:36px;font-size:16px}
  button.link{min-height:32px;font-size:13px}
  button.markbtn{font-size:26px;width:40px;min-height:40px}
  button.markbtn.sm{font-size:22px;width:36px;min-height:36px}
  details.step>summary{padding:8px}
  details.step .body{padding:2px 8px 10px}
  .panel{margin-left:0}
  dialog{width:100%;max-width:none;height:100%;max-height:none;margin:0;border:0;border-radius:0;padding:12px 12px max(12px,env(safe-area-inset-bottom))}
  #dlg>.tile-top{position:sticky;top:-12px;z-index:3;background:var(--card);padding:8px 0;border-bottom:1px solid var(--line)}
  #dlg>.tile-top .ring{width:56px;height:56px}
  select,input[type=text],input[type=search],textarea{font-size:16px}
}
