:root{
  --sol-base3:#fdf6e3;--sol-base2:#eee8d5;--sol-base1:#93a1a1;
  --sol-base00:#586e75;--sol-base01:#073642;
  --sol-blue:#268bd2;--sol-red:#dc322f;
}
[data-theme="solarized"]{
  --bg:var(--sol-base3);--card:var(--sol-base2);--border:#d0c9b5;
  --text:var(--sol-base01);--text2:var(--sol-base00);--accent:var(--sol-blue);--red:var(--sol-red);
}
[data-theme="light"]{
  --bg:#f2f2f7;--card:#fff;--border:#e5e5ea;--text:#1c1c1e;--text2:#6f6f75;--accent:#007aff;--red:#ff3b30;
}
[data-theme="dark"]{
  --bg:#000;--card:#1c1c1e;--border:#38383a;--text:#fff;--text2:#8e8e93;--accent:#0a84ff;--red:#ff453a;
}
[data-theme="system"]{
  --bg:#f2f2f7;--card:#fff;--border:#e5e5ea;--text:#1c1c1e;--text2:#6f6f75;--accent:#007aff;--red:#ff3b30;
}
@media(prefers-color-scheme:dark){
  [data-theme="system"]{
    --bg:#000;--card:#1c1c1e;--border:#38383a;--text:#fff;--text2:#8e8e93;--accent:#0a84ff;--red:#ff453a;
  }
}
*{box-sizing:border-box;}
html,body{height:100%;}
body{
  margin:0;
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",sans-serif;
  color:var(--text);
  background:var(--bg);
  padding:20px 12px 28px;
}
.wrap{max-width:820px;margin:0 auto;}
.hero{padding:8px 4px 14px;}
.hero h1{margin:0 0 4px;font-size:28px;letter-spacing:-.02em;}
.hero p{margin:0;color:var(--text2);font-weight:600;}
.menu-title{
  font-size:11px;font-weight:700;color:var(--text2);
  text-transform:uppercase;letter-spacing:.07em;margin:0 2px 8px;
}
.block{margin-bottom:16px;}
.mrow-group{border-radius:12px;overflow:hidden;border:1px solid var(--border);background:var(--card);}
.mrow{
  display:flex;align-items:center;justify-content:space-between;
  padding:12px 14px;border-bottom:1px solid var(--border);
  cursor:pointer;
}
.mrow:last-child{border-bottom:none;}
.mrow:active{opacity:.6;}
.mrow-label{font-size:15px;font-weight:500;}
.mrow-sub{display:block;font-size:12px;color:var(--text2);margin-top:1px;}
.mrow-right{font-size:14px;color:var(--text2);}
.buttons-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:8px;}
.app-btn{
  display:flex;flex-direction:column;gap:1px;
  text-decoration:none;color:var(--text);
  background:var(--card);border:1px solid var(--border);border-radius:11px;
  padding:10px 12px;
}
.app-btn:active{opacity:.65;}
.app-btn strong{font-size:14px;}
.app-btn span{font-size:12px;color:var(--text2);}
#fab-bar{
  position:fixed;bottom:calc(8px + env(safe-area-inset-bottom));
  right:8px;left:auto;transform:translateZ(0);
  display:flex;align-items:center;gap:0;z-index:1200;
  background:var(--card);
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  border:1px solid var(--border);
  border-radius:16px;
  padding:3px 5px;
  opacity:.55;
  transition:opacity .2s ease;
}
#fab-bar:hover,#fab-bar:focus-within{opacity:1;}
.fab-btn{
  width:36px;height:36px;border-radius:10px;background:transparent;border:none;
  color:var(--text2);cursor:pointer;display:flex;align-items:center;justify-content:center;
  padding:0;touch-action:manipulation;flex-shrink:0;
}
.fab-btn svg{width:18px;height:18px;}
.fab-btn:active{opacity:.45;}
.screen{display:none;position:fixed;inset:0;z-index:1100;background:var(--bg);overflow:auto;}
.screen.show{display:block;}
.screen-nav{
  position:sticky;top:0;z-index:2;background:var(--card);
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  padding:14px 14px 10px;border-bottom:1px solid var(--border);
}
.screen-nav h2{font-size:16px;margin:0;flex:1;text-align:center;}
.nav-back{border:none;background:none;color:var(--accent);font-size:15px;font-weight:600;cursor:pointer;min-width:50px;}
.screen-body{padding:12px;}
.theme-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;}
.theme-option{
  border:1px solid var(--border);background:var(--card);color:var(--text);
  border-radius:10px;padding:10px 8px;font-weight:700;cursor:pointer;
}
.theme-option.is-selected{border-color:var(--accent);color:var(--accent);}
