*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none}
  html,body{margin:0;height:100%;overflow:hidden;background:#0d2218;font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
  #c{position:fixed;inset:0;width:100%;height:100%;display:block;touch-action:none}

  #top{
    position:fixed;left:50%;top:calc(12px + env(safe-area-inset-top));transform:translateX(-50%);
    display:flex;align-items:center;gap:12px;padding:8px 16px;border-radius:999px;
    background:rgba(255,255,255,.95);
    box-shadow:0 2px 10px rgba(30,60,40,.15);font-weight:600;font-size:14px;color:#1d2b24;
    pointer-events:none;white-space:nowrap
  }
  #top i{width:1px;height:16px;background:#c9d4cc}
  #money{color:#1e7a4c}

  #stick{
    position:fixed;left:calc(24px + env(safe-area-inset-left));bottom:calc(28px + env(safe-area-inset-bottom));
    width:132px;height:132px;border-radius:50%;
    background:rgba(25,45,35,.16);border:2px solid rgba(255,255,255,.75);
    touch-action:none
  }
  #knob{
    position:absolute;left:50%;top:50%;width:56px;height:56px;border-radius:50%;
    background:rgba(255,255,255,.95);box-shadow:0 3px 10px rgba(20,40,30,.3);
    transform:translate(-50%,-50%);pointer-events:none
  }

  #hint{
    position:fixed;left:50%;bottom:calc(190px + env(safe-area-inset-bottom));transform:translateX(-50%);
    padding:8px 14px;border-radius:12px;background:rgba(29,43,36,.78);color:#fff;font-size:13px;
    text-align:center;max-width:86vw;transition:opacity .8s;pointer-events:none
  }
  #hint.gone{opacity:0}
  #top,#stick,#hint{z-index:10}

  #needsBtn{
    position:fixed;left:calc(12px + env(safe-area-inset-left));top:calc(10px + env(safe-area-inset-top));
    width:46px;height:46px;border-radius:50%;border:0;padding:0;background:rgba(255,255,255,.92);
    box-shadow:0 2px 10px rgba(30,60,40,.18);font-size:24px;line-height:46px;text-align:center;
    cursor:pointer;z-index:10;touch-action:manipulation
  }
  #needsBtn.alert{box-shadow:0 0 0 3px #e5534b,0 2px 10px rgba(30,60,40,.18);animation:pulse 1s infinite}
  @keyframes pulse{50%{transform:scale(1.09)}}

  #panel{
    position:fixed;left:calc(12px + env(safe-area-inset-left));top:calc(64px + env(safe-area-inset-top));
    width:262px;padding:10px 14px 8px;border-radius:20px;background:rgba(255,255,255,.97);
    box-shadow:0 4px 18px rgba(30,60,40,.2);opacity:0;transform:translateY(-6px);
    pointer-events:none;transition:opacity .18s,transform .18s;z-index:10
  }
  #panel.open{opacity:1;transform:none;pointer-events:auto}
  .nrow{display:flex;align-items:center;gap:9px;height:32px;font-size:13px;font-weight:700;color:#1d2b24}
  .ni{width:26px;height:26px;border-radius:9px;display:flex;align-items:center;justify-content:center;flex:none}
  .ni .ic{width:16px;height:16px}
  .nn{width:62px}
  .nv{width:24px;text-align:right;font-size:11.5px;font-weight:800;color:#6b7a70;font-variant-numeric:tabular-nums}
  .mline{display:flex;align-items:center;gap:10px;padding:6px 2px 10px;margin-bottom:4px;border-bottom:1px solid #e6ece8}
  .mline .ic{width:30px;height:30px;color:#1e7a4c}
  .mline b{display:block;font-size:14.5px;color:#1d2b24;letter-spacing:-.01em}
  .mline small{display:block;font-size:11.5px;color:#6b7a70;font-weight:600}
  .nb{flex:1;height:9px;border-radius:99px;background:#e6ece8;overflow:hidden;box-shadow:inset 0 1px 2px rgba(0,0,0,.08)}
  .nb b{display:block;height:100%;width:50%;border-radius:99px;transition:width .25s,background .25s}

  #act{
    position:fixed;right:calc(22px + env(safe-area-inset-right));bottom:calc(52px + env(safe-area-inset-bottom));
    min-width:150px;max-width:62vw;height:54px;padding:0 20px;border:0;border-radius:27px;
    background:#1e7a4c;color:#fff;font:700 15px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
    box-shadow:0 4px 14px rgba(20,60,40,.35);overflow:hidden;opacity:0;
    transform:translateY(10px) scale(.96);pointer-events:none;
    transition:opacity .18s,transform .18s,background .2s;z-index:10;touch-action:manipulation
  }
  #act.show{opacity:1;transform:none;pointer-events:auto}
  #act.busy{background:#2f3f58}
  #actFill{position:absolute;left:0;top:0;bottom:0;width:0;background:rgba(255,255,255,.22);pointer-events:none}
  #actLabel{position:relative;white-space:nowrap}

  #toast{
    position:fixed;left:50%;top:calc(120px + env(safe-area-inset-top));transform:translate(-50%,-6px);
    padding:8px 14px;border-radius:12px;background:rgba(29,43,36,.88);color:#fff;font-size:13px;
    font-weight:600;opacity:0;transition:opacity .2s,transform .2s;pointer-events:none;
    max-width:86vw;text-align:center;z-index:10
  }
  #toast.show{opacity:1;transform:translate(-50%,0)}

  #dim{position:fixed;inset:0;background:#05080f;opacity:0;transition:opacity 1.1s;pointer-events:none;z-index:5}
  #dim.on{opacity:.62}

  #shopBtn{
    position:fixed;right:calc(12px + env(safe-area-inset-right));top:calc(10px + env(safe-area-inset-top));
    height:46px;padding:0 15px;border:0;border-radius:23px;background:rgba(255,255,255,.92);
    box-shadow:0 2px 10px rgba(30,60,40,.18);font:700 14px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
    color:#1d2b24;z-index:10;touch-action:manipulation
  }
  #shop{
    position:fixed;left:0;right:0;bottom:0;padding:14px 0 calc(14px + env(safe-area-inset-bottom));
    background:#f6f1e6;border-radius:22px 22px 0 0;box-shadow:0 -6px 24px rgba(30,60,40,.22);
    transform:translateY(105%);transition:transform .25s;z-index:12
  }
  #shop.open{transform:none}
  #shopHead{display:flex;align-items:center;gap:10px;padding:0 16px 10px}
  #shopHead b{flex:1;font-size:17px;color:#1d2b24}
  #shopMoney{font-weight:700;color:#1e7a4c;font-size:14px}
  #shopClose{width:34px;height:34px;border-radius:50%;border:0;background:#eef2ef;font-size:15px;color:#1d2b24}
  #tabs,#cards{display:flex;gap:8px;overflow-x:auto;padding:0 16px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  #tabs::-webkit-scrollbar,#cards::-webkit-scrollbar{display:none}
  #tabs{padding-bottom:10px}
  .tab{flex:none;padding:7px 12px;border-radius:99px;border:0;background:#eef2ef;color:#1d2b24;font:700 12.5px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;transition:background .15s,color .15s}
  .tab.on{background:#1e7a4c;color:#fff;box-shadow:0 3px 10px rgba(30,122,76,.3)}
  .card{flex:none;width:112px;padding:8px 8px 10px;border-radius:18px;border:0;background:#fff;text-align:center;font-family:inherit;color:#1d2b24;box-shadow:0 1px 4px rgba(30,50,40,.12);transition:transform .14s}
  .card:active{transform:scale(.96)}
  .card .th{display:block;width:100%;aspect-ratio:1;border-radius:13px;background:radial-gradient(circle at 50% 40%,#fbf6ea,#eadfc6);object-fit:contain}
  .card .cp{display:inline-block;padding:2px 8px;border-radius:99px;background:#e3f4ea}
  .card.poor .cp{background:#fbe4e1}
  .card.poor .th{filter:saturate(.55) opacity(.8)}
  .card .ci{font-size:32px;height:40px;line-height:40px}
  .card .cn{font-size:12px;font-weight:600;margin-top:4px;height:30px;overflow:hidden}
  .card .cp{font-size:12px;font-weight:700;color:#1e7a4c;margin-top:2px}
  .card.poor .cp{color:#e5534b}
  .card .sw{width:40px;height:40px;border-radius:50%;margin:0 auto;border:2px solid #fff;box-shadow:0 0 0 1px #cfd8d2}
  .card.cur{outline:2px solid #1e7a4c}

  #bar{
    position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom));transform:translate(-50%,20px);
    display:flex;gap:8px;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;z-index:12;max-width:96vw
  }
  #bar.on{opacity:1;transform:translate(-50%,0);pointer-events:auto}
  #bar button{
    height:50px;padding:0 15px;border:0;border-radius:25px;background:#fff;display:none;white-space:nowrap;
    box-shadow:0 3px 12px rgba(20,50,35,.25);font:700 14px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:#1d2b24;
    touch-action:manipulation
  }
  #bar button.ok{background:#1e7a4c;color:#fff}
  #bar button.no{color:#e5534b}
  body.shopmode #stick,body.shopmode #act,body.shopmode #needsBtn,body.shopmode #hint,
  body.shopmode #shopBtn,body.shopmode #panel{display:none}

  /* ===== icons ===== */
  .ic{width:1.15em;height:1.15em;flex:none;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;vertical-align:-.2em}
  .ic .f{fill:currentColor;fill-opacity:.2}
  .ic .k{fill:currentColor;stroke:none}

  /* ===== HUD polish ===== */
  #top{gap:10px;color:#1d2b24}
  #clock{display:inline-flex;align-items:center;gap:6px}
  #clock .ic{color:#c9894a;width:17px;height:17px}
  #needsBtn{display:flex;align-items:center;justify-content:center;color:#1e7a4c;font-size:0;line-height:1}
  #needsBtn .ic{width:28px;height:28px;stroke-width:1.6}
  #shopBtn,#phoneBtn{display:flex;align-items:center;justify-content:center;color:#1d2b24;font-size:14px}
  #shopBtn{gap:7px}
  #shopBtn .ic{width:21px;height:21px;color:#1e7a4c}
  #phoneBtn{padding:0}
  #phoneIc{display:flex}
  #phoneIc .ic{width:25px;height:25px;color:#1e7a4c}
  .ni{display:flex;justify-content:center}
  .ni .ic{width:19px;height:19px}
  #act{display:flex;align-items:center;justify-content:center;gap:9px}
  #act .ic{width:22px;height:22px;position:relative}
  #actLabel{display:flex;align-items:center;gap:9px}
  #toast{display:flex;align-items:center;gap:8px;justify-content:center}
  #toast .ic{width:18px;height:18px;color:#7be0a7}
  #shopClose{display:flex;align-items:center;justify-content:center;padding:0}
  #shopClose .ic{width:18px;height:18px}
  .tab{display:inline-flex;align-items:center;gap:6px}
  .tab .ic{width:16px;height:16px}
  .card .ci{height:54px;display:flex;align-items:center;justify-content:center}
  .card .ci .ic{width:46px;height:46px;padding:9px;border-radius:50%;background:linear-gradient(145deg,#e4f3ea,#cfe6d9);color:#1e7a4c;stroke-width:1.6}
  #bar button{display:none;align-items:center;gap:7px}
  #bar button .ic{width:19px;height:19px}

  /* ===== work overlay ===== */
  #work{position:fixed;left:50%;top:50%;width:min(84vw,320px);padding:22px 22px 18px;border-radius:26px;background:rgba(255,255,255,.96);
    box-shadow:0 14px 40px rgba(10,30,20,.35);text-align:center;opacity:0;pointer-events:none;transform:translate(-50%,-46%) scale(.96);
    transition:opacity .25s,transform .25s;z-index:11}
  #work.on{opacity:1;pointer-events:auto;transform:translate(-50%,-50%)}
  #workIcon{width:68px;height:68px;margin:0 auto;border-radius:22px;display:flex;align-items:center;justify-content:center;color:#fff;box-shadow:0 6px 16px rgba(0,0,0,.22)}
  #workIcon .ic{width:36px;height:36px}
  #workTitle{font-weight:800;font-size:18px;margin-top:10px;color:#1d2b24}
  #workSub{font-size:13px;color:#5d6b63;margin:4px 0 14px}
  #workBar{height:10px;border-radius:99px;background:#e3e9e5;overflow:hidden;margin-bottom:16px}
  #workBar b{display:block;height:100%;width:0;background:linear-gradient(90deg,#1e7a4c,#4fcf8d);border-radius:99px}
  #workStop{border:0;background:#eef2ef;border-radius:20px;height:40px;padding:0 18px;font:700 13px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:#c8433b}

  /* ===== PHONE ===== */
  #phoneBadge{position:absolute;top:-3px;right:-3px;min-width:18px;height:18px;border-radius:9px;padding:0 4px;background:#e5534b;color:#fff;font:700 11px/18px system-ui,sans-serif;display:none}
  #phoneBtn{
    position:fixed;right:calc(12px + env(safe-area-inset-right));top:calc(62px + env(safe-area-inset-top));
    width:46px;height:46px;border-radius:50%;border:0;padding:0;background:rgba(255,255,255,.92);
    box-shadow:0 2px 10px rgba(30,60,40,.18);z-index:10;touch-action:manipulation
  }
  #phone{
    position:fixed;left:50%;bottom:0;width:min(94vw,380px);height:min(66vh,640px);
    padding:10px 10px 0;border-radius:44px 44px 0 0;z-index:12;
    background:linear-gradient(155deg,#3b4a43 0%,#18211d 38%,#0b100e 100%);
    box-shadow:0 -14px 44px rgba(4,14,9,.5),inset 0 0 0 1.5px rgba(255,255,255,.16),inset 0 2px 0 rgba(255,255,255,.22);
    transform:translate(-50%,108%);transition:transform .38s cubic-bezier(.22,1,.36,1);will-change:transform
  }
  #phone.open{transform:translate(-50%,0)}
  #phone::before,#phone::after{content:"";position:absolute;width:4px;border-radius:3px;background:#2a3631}
  #phone::before{right:-3px;top:96px;height:58px}
  #phone::after{left:-3px;top:84px;height:34px;box-shadow:0 46px 0 #2a3631}
  #scr{position:relative;height:100%;contain:layout paint;border-radius:35px 35px 0 0;overflow:hidden;background:#14201a;color:#fff;display:flex;flex-direction:column}
  #scr .wp{position:absolute;inset:0;width:100%;height:100%;display:block}
  #sb{position:relative;z-index:3;flex:none;height:46px;padding:12px 24px 0;display:flex;align-items:flex-start;justify-content:space-between;font:700 14px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;letter-spacing:.01em;transition:color .25s}
  #sb::after{content:"";position:absolute;left:50%;top:9px;width:92px;height:25px;margin-left:-46px;border-radius:14px;background:#050807}
  #sbR{display:flex;align-items:center;gap:6px;margin-top:2px}
  #sbR svg{display:block;height:12px;width:auto}
  #scr.light #sb{color:#1d2b24}
  #phoneBody{position:relative;z-index:2;flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  #phoneBody::-webkit-scrollbar{display:none}
  #homeBar{position:relative;z-index:4;flex:none;height:30px;border:0;background:none;padding:0;display:flex;align-items:center;justify-content:center;touch-action:manipulation}
  #homeBar i{display:block;width:118px;height:5px;border-radius:3px;background:rgba(255,255,255,.85);transition:background .25s}
  #scr.light #homeBar{background:#f6f1e6}
  #scr.light #homeBar i{background:#1d2b24}
  .view{min-height:100%;animation:vin .24s cubic-bezier(.2,.9,.3,1) both}
  .view.fw{animation-name:vfw}.view.bw{animation-name:vbw}
  @keyframes vin{from{opacity:0;transform:scale(.97)}to{opacity:1;transform:none}}
  @keyframes vfw{from{opacity:0;transform:translateX(22px)}to{opacity:1;transform:none}}
  @keyframes vbw{from{opacity:0;transform:translateX(-22px)}to{opacity:1;transform:none}}
  .row,.go,.app .tile,.ah .bk,.away{transition:transform .14s ease,box-shadow .14s ease}
  .row:active,.go:active,.away:active{transform:scale(.97)}
  .ah .bk:active{transform:scale(.9)}
  .greet{text-align:center;font-size:13px;font-weight:700;opacity:.9;margin-top:-6px;margin-bottom:12px}
  .chips{display:flex;justify-content:center;gap:6px;margin:0 0 14px;flex-wrap:wrap}
  .chip{display:inline-flex;align-items:center;gap:5px;padding:5px 10px;border-radius:99px;background:rgba(10,16,13,.34);box-shadow:inset 0 0 0 1px rgba(255,255,255,.2);font-size:11.5px;font-weight:700;text-shadow:none}
  .chip .ic{width:14px;height:14px}
  .chip.bad{background:rgba(192,57,47,.55)}
  .app .tile{background-blend-mode:overlay}
  .app .tile::after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(180deg,rgba(255,255,255,.28),rgba(255,255,255,0) 48%);pointer-events:none}
  .app .tile{position:relative}
  @media (prefers-reduced-motion:reduce){.view{animation:none}#phone{transition:none}}

  /* home screen */
  .home{padding:6px 18px 12px;text-shadow:0 1px 8px rgba(0,0,0,.25)}
  .clk{text-align:center;padding:6px 0 14px}
  .clk b{display:block;font-size:64px;line-height:1;font-weight:300;letter-spacing:-.03em}
  .clk span{display:block;margin-top:6px;font-size:14px;font-weight:600;opacity:.92}
  .wid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:18px}
  .w{border-radius:22px;padding:12px 14px;background:linear-gradient(160deg,rgba(255,255,255,.24),rgba(255,255,255,.1));box-shadow:inset 0 0 0 1px rgba(255,255,255,.26),0 6px 16px rgba(10,6,20,.18);text-shadow:none}
  .w .ic{width:20px;height:20px;color:#ffe3a6}
  .w small{display:block;margin-top:6px;font-size:11.5px;font-weight:600;opacity:.82}
  .w b{display:block;font-size:19px;font-weight:800;letter-spacing:-.01em}
  .dots{display:flex;gap:4px;margin-top:6px}
  .dots i{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.3)}
  .dots i.on{background:#ffe3a6}
  .apps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px 8px}
  .app{border:0;background:none;padding:0;color:#fff;display:flex;flex-direction:column;align-items:center;gap:7px;font:600 12.5px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;position:relative;text-shadow:0 1px 6px rgba(0,0,0,.35);touch-action:manipulation}
  .app .tile{width:62px;height:62px;border-radius:19px;display:flex;align-items:center;justify-content:center;box-shadow:0 6px 14px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.35);transition:transform .12s}
  .app:active .tile{transform:scale(.92)}
  .app .tile .ic{width:30px;height:30px;color:#fff}
  .app.off{opacity:.55}
  .app.off .tile{filter:saturate(.5)}
  .app em{position:absolute;top:-5px;right:calc(50% - 38px);min-width:20px;height:20px;border-radius:10px;padding:0 5px;background:#e5534b;color:#fff;font:800 11.5px/20px system-ui,sans-serif;font-style:normal;box-shadow:0 0 0 2px rgba(20,32,26,.5)}
  .app u{position:absolute;top:44px;text-decoration:none;font-size:9.5px;font-weight:800;letter-spacing:.04em;background:rgba(0,0,0,.45);padding:2px 6px;border-radius:99px}
  .away{display:flex;align-items:center;justify-content:center;gap:7px;margin:22px auto 6px;height:40px;padding:0 18px;border:0;border-radius:20px;background:rgba(10,16,13,.34);color:#fff;font:700 13px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;box-shadow:inset 0 0 0 1px rgba(255,255,255,.22)}
  .away .ic{width:16px;height:16px}

  /* app screens */
  .appv{min-height:100%;background:#f6f1e6;color:#1d2b24;padding:2px 16px 20px}
  .ah{display:flex;align-items:center;gap:10px;padding:2px 0 14px}
  .ah .bk{width:38px;height:38px;border-radius:50%;border:0;background:#fff;color:#1d2b24;display:flex;align-items:center;justify-content:center;box-shadow:0 1px 5px rgba(20,40,30,.14);padding:0;flex:none}
  .ah .bk .ic{width:20px;height:20px}
  .ah h2{margin:0;font-size:26px;line-height:1.05;font-weight:800;letter-spacing:-.025em}
  .ah small{display:block;margin-top:3px;font-size:12px;color:#6b7a70;font-weight:600}
  .tile2{width:48px;height:48px;border-radius:15px;flex:none;display:flex;align-items:center;justify-content:center;color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 3px 8px rgba(20,30,25,.2)}
  .tile2 .ic{width:25px;height:25px}
  .row{display:flex;align-items:center;gap:12px;width:100%;border:0;background:#fff;border-radius:20px;padding:11px 12px;margin-bottom:9px;text-align:left;font-family:inherit;color:#1d2b24;box-shadow:0 1px 3px rgba(40,50,40,.1);touch-action:manipulation}
  .row.lk{opacity:.62}
  .rt{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px;font-size:15px}
  .rt b{font-weight:700;letter-spacing:-.01em}
  .rt small{font-size:12px;color:#6b7a70;font-weight:600}
  .rs{display:inline-flex;align-items:center;gap:4px;font-size:11.5px;font-weight:800;padding:5px 10px;border-radius:99px;background:#dff3e7;color:#177044;white-space:nowrap}
  .rs.no{background:#fbe4e1;color:#c0392f}
  .rs.lock{background:#e9e6dd;color:#6d6a60}
  .rs .ic{width:13px;height:13px}
  .note{font-size:13px;line-height:1.45;color:#6b7a70;margin:0 0 14px;font-weight:500}
  .jh{border-radius:26px;padding:20px 18px 18px;color:#fff;position:relative;overflow:hidden;margin-bottom:12px}
  .jh::after{content:"";position:absolute;right:-34px;top:-34px;width:150px;height:150px;border-radius:50%;box-shadow:0 0 0 18px rgba(255,255,255,.08),0 0 0 40px rgba(255,255,255,.06)}
  .jh .gl{width:58px;height:58px;border-radius:19px;background:rgba(255,255,255,.22);display:flex;align-items:center;justify-content:center;box-shadow:inset 0 0 0 1px rgba(255,255,255,.3)}
  .jh .gl .ic{width:32px;height:32px}
  .jh h3{margin:14px 0 2px;font-size:23px;font-weight:800;letter-spacing:-.025em;position:relative}
  .jh .rk{display:inline-block;font-size:11.5px;font-weight:800;padding:4px 10px;border-radius:99px;background:rgba(255,255,255,.22);margin-bottom:2px}
  .jh p{margin:8px 0 0;font-size:13px;line-height:1.45;opacity:.94;position:relative;max-width:92%}
  .st{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:12px}
  .st div{background:#fff;border-radius:18px;padding:12px;box-shadow:0 1px 3px rgba(40,50,40,.1)}
  .st .ic{width:19px;height:19px;color:#1e7a4c}
  .st small{display:block;margin-top:6px;font-size:11.5px;color:#6b7a70;font-weight:600}
  .st b{display:block;font-size:15px;font-weight:800;letter-spacing:-.01em}
  .fxl{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:14px}
  .fx{display:inline-flex;align-items:center;gap:6px;background:#fff;border-radius:99px;padding:6px 11px 6px 8px;font-size:12.5px;font-weight:700;box-shadow:0 1px 3px rgba(40,50,40,.1)}
  .fx .ic{width:16px;height:16px}
  .fx.up{color:#177044}
  .fx.dn{color:#c0392f}
  .sec{font-size:13px;font-weight:800;margin:4px 0 8px;color:#3d4c43}
  .go{display:flex;align-items:center;justify-content:center;gap:9px;width:100%;height:54px;border:0;border-radius:27px;background:linear-gradient(180deg,#26935b,#1b6e44);color:#fff;font:800 16px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;box-shadow:0 5px 14px rgba(22,100,60,.35),inset 0 1px 0 rgba(255,255,255,.3);touch-action:manipulation}
  .go .ic{width:22px;height:22px}
  .go[disabled]{background:#c7cec9;box-shadow:none;color:#fff}
  .why{margin:10px 2px 0;font-size:13px;line-height:1.4;color:#c0392f;min-height:18px;font-weight:600;text-align:center}
  .pay{border-radius:26px;padding:20px 20px 18px;color:#fff;position:relative;overflow:hidden;margin-bottom:12px;
    background:radial-gradient(circle at 88% 18%,rgba(255,255,255,.2) 0 16%,transparent 17%),radial-gradient(circle at 88% 18%,rgba(255,255,255,.12) 0 28%,transparent 29%),radial-gradient(circle at 88% 18%,rgba(255,255,255,.08) 0 40%,transparent 41%),linear-gradient(140deg,#25915a,#0f4f37)}
  .pay .lg{display:flex;align-items:center;gap:7px;font-size:13px;font-weight:700;opacity:.92}
  .pay .lg .ic{width:19px;height:19px}
  .pay small{display:block;margin-top:20px;font-size:12px;opacity:.82;font-weight:600}
  .pay b{display:block;font-size:34px;font-weight:800;letter-spacing:-.03em;margin-top:2px}
  .kv{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-bottom:14px}
  .kv div{background:#fff;border-radius:16px;padding:10px 12px;font-size:12px;color:#6b7a70;font-weight:600;box-shadow:0 1px 3px rgba(40,50,40,.1)}
  .kv b{display:block;font-size:15px;color:#1d2b24;font-weight:800;margin-top:2px}
  .tx{display:flex;align-items:center;gap:11px;background:#fff;border-radius:18px;padding:10px 12px;margin-bottom:7px;font-size:13.5px;font-weight:600;box-shadow:0 1px 3px rgba(40,50,40,.08)}
  .tx .ti{width:36px;height:36px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex:none}
  .tx .ti .ic{width:18px;height:18px}
  .tx .ti.p{background:#dff3e7;color:#177044}
  .tx .ti.m{background:#fbe4e1;color:#c0392f}
  .tx .tt{flex:1;min-width:0}
  .tx small{display:block;color:#8a968e;font-size:11px;font-weight:600;margin-top:1px}
  .tx .pos{color:#177044;font-weight:800;white-space:nowrap}
  .tx .neg{color:#c0392f;font-weight:800;white-space:nowrap}
  .mg{display:flex;gap:11px;background:#fff;border-radius:20px;padding:11px 12px;margin-bottom:8px;font-size:13.5px;line-height:1.4;box-shadow:0 1px 3px rgba(40,50,40,.08);position:relative}
  .mg .av{width:42px;height:42px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;color:#fff}
  .mg .av .ic{width:21px;height:21px}
  .mg .mt{flex:1;min-width:0}
  .mg small{display:flex;justify-content:space-between;gap:8px;color:#8a968e;font-size:11px;font-weight:700;margin-bottom:2px}
  .mg small b{color:#1d2b24;font-size:13px}
  .mg.new::after{content:"";position:absolute;right:12px;top:30px;width:9px;height:9px;border-radius:50%;background:#1e7a4c}
  .empty{text-align:center;color:#8a968e;padding:26px;font-size:13px;font-weight:600}

  /* ===== settings / saving ===== */
  textarea{user-select:text;-webkit-user-select:text}
  .svc{display:flex;gap:12px;align-items:flex-start;border-radius:20px;padding:13px 14px;margin-bottom:14px;box-shadow:0 1px 3px rgba(40,50,40,.1)}
  .svc.ok{background:#dff3e7;color:#14583a}
  .svc.warn{background:#fdf0d6;color:#7a5410}
  .svc b{display:block;font-size:15px;font-weight:800;letter-spacing:-.01em}
  .svc small{display:block;margin-top:3px;font-size:12.5px;line-height:1.4;font-weight:600;opacity:.88}
  .sv-i{width:34px;height:34px;border-radius:12px;background:rgba(255,255,255,.7);display:flex;align-items:center;justify-content:center;flex:none}
  .sv-i .ic{width:19px;height:19px}
  .cbox{display:block;width:100%;margin:10px 0;border:0;border-radius:16px;padding:12px 13px;background:#fff;color:#1d2b24;font:500 13px/1.4 ui-monospace,Menlo,Consolas,monospace;resize:none;box-shadow:inset 0 0 0 1.5px #d9dfd9;outline:none}
  .cbox:focus{box-shadow:inset 0 0 0 2px #1e7a4c}
  .go.sec2{background:#fff;color:#14583a;box-shadow:inset 0 0 0 1.5px #bcd9c8,0 1px 3px rgba(40,50,40,.08);height:48px;font-size:15px}
  .go.danger{background:#fff;color:#c0392f;box-shadow:inset 0 0 0 1.5px #efc4c0;height:48px;font-size:14px}

  body.phonemode #stick,body.phonemode #act,body.phonemode #needsBtn,body.phonemode #hint,body.phonemode #shopBtn,
  body.phonemode #phoneBtn,body.phonemode #panel,body.shopmode #phoneBtn,
  body.working #stick,body.working #act,body.working #hint,body.working #shopBtn,body.working #phoneBtn{display:none}

  /* ===== Stage 5: places, travel, map ===== */
  #place{position:fixed;left:50%;top:calc(60px + env(safe-area-inset-top));transform:translateX(-50%);padding:4px 12px;border-radius:99px;
    background:rgba(29,43,36,.74);color:#fff;font:600 12px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;display:none;z-index:10;pointer-events:none;
    white-space:nowrap;max-width:68vw;overflow:hidden;text-overflow:ellipsis}
  body.afar #place{display:block}
  #wp{position:fixed;left:50%;top:calc(90px + env(safe-area-inset-top));transform:translate(-50%,-8px);display:flex;align-items:center;gap:8px;padding:6px 8px 6px 12px;
    border-radius:99px;background:rgba(255,255,255,.93);box-shadow:0 2px 10px rgba(30,60,40,.2);font:700 13px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
    color:#1d2b24;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;z-index:10;max-width:66vw;white-space:nowrap}
  #wp.on{opacity:1;transform:translate(-50%,0);pointer-events:auto}
  #wpArrow{display:flex;color:#1e7a4c;transition:transform .15s}
  #wpTxt{overflow:hidden;text-overflow:ellipsis}
  #wpX{width:24px;height:24px;border:0;border-radius:50%;background:#eef2ef;color:#1d2b24;display:flex;align-items:center;justify-content:center;padding:0}
  body.phonemode #wp,body.shopmode #wp,body.working #wp{display:none}
  #runBtn{position:fixed;right:calc(24px + env(safe-area-inset-right));bottom:calc(122px + env(safe-area-inset-bottom));width:60px;height:60px;border-radius:50%;border:0;padding:0;
    background:conic-gradient(#1e7a4c var(--p,100%),#cfd8d2 0);color:#1d2b24;display:flex;align-items:center;justify-content:center;z-index:10;touch-action:none;box-shadow:0 3px 12px rgba(20,50,35,.28)}
  #runBtn::before{content:"";position:absolute;inset:5px;border-radius:50%;background:#fff}
  #runBtn svg{position:relative}
  #runBtn.on::before{background:#e3f4ea}
  #runBtn.tired{background:conic-gradient(#d9443b var(--p,100%),#e6cfcb 0);color:#9a6b66}
  body.phonemode #runBtn,body.shopmode #runBtn,body.working #runBtn{display:none}
  #mini{position:fixed;right:calc(12px + env(safe-area-inset-right));top:calc(116px + env(safe-area-inset-top));width:112px;height:112px;border-radius:20px;overflow:hidden;
    border:3px solid #fff;box-shadow:0 3px 12px rgba(20,50,35,.3);background:#bcd3a8;z-index:9;display:none;touch-action:manipulation}
  #mini canvas{width:100%;height:100%;display:block}
  body.incity #mini{display:block}
  body.phonemode #mini,body.shopmode #mini,body.working #mini{display:none}
  body.afar #shopBtn{display:none}
  body.phonemode #place,body.working #place,body.shopmode #place{display:none}
  #loader{position:fixed;inset:0;z-index:30;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .35s;
    background:repeating-linear-gradient(45deg,rgba(255,255,255,.05) 0 16px,transparent 16px 32px),repeating-linear-gradient(-45deg,rgba(255,255,255,.05) 0 16px,transparent 16px 32px),linear-gradient(160deg,#1e7a4c,#0c3d2a)}
  #loader.on{opacity:1;pointer-events:auto}
  #ldCard{text-align:center;color:#fff;width:min(80vw,300px)}
  #ldIcon{width:84px;height:84px;margin:0 auto 18px;border-radius:26px;background:rgba(255,255,255,.18);box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.35);display:flex;align-items:center;justify-content:center}
  #ldIcon .ic{width:44px;height:44px;stroke-width:1.6}
  #loader.on #ldIcon{animation:ldbob 1s ease-in-out infinite}
  @keyframes ldbob{50%{transform:translateY(-6px)}}
  #ldTitle{font-weight:800;font-size:22px;letter-spacing:-.02em}
  #ldSub{margin-top:6px;font-size:14px;font-weight:600;opacity:.85;min-height:20px}
  #ldBar{height:8px;border-radius:99px;background:rgba(255,255,255,.2);overflow:hidden;margin-top:22px}
  #ldBar b{display:block;height:100%;width:0;border-radius:99px;background:#ffe3a6}
  #loader.on #ldBar b{animation:ldfill 1.5s ease-in-out forwards}
  @keyframes ldfill{to{width:100%}}
  .mapbox{border-radius:22px;overflow:hidden;box-shadow:0 1px 4px rgba(40,50,40,.18);margin-bottom:12px;background:#e9efdc}
  .mapsvg{display:block;width:100%;height:auto}
  .pcard{background:#fff;border-radius:22px;padding:12px 12px 4px;margin-bottom:10px;box-shadow:0 1px 4px rgba(40,50,40,.12)}
  .pcard .row{box-shadow:none;background:#f6f1e6}
  .pc-h{display:flex;gap:12px;align-items:flex-start;margin-bottom:10px}
  .pc-t{flex:1;min-width:0}
  .pc-t b{display:block;font-size:17px;font-weight:800;letter-spacing:-.02em}
  .pc-t small{display:block;margin-top:2px;font-size:12.5px;line-height:1.35;color:#6b7a70;font-weight:600}
  .pc-x{width:32px;height:32px;border-radius:50%;border:0;background:#eef2ef;color:#1d2b24;display:flex;align-items:center;justify-content:center;padding:0;flex:none}
  .pc-x .ic{width:16px;height:16px}
  body.travel #stick,body.travel #act,body.travel #needsBtn,body.travel #hint,body.travel #phoneBtn,body.travel #shopBtn{display:none}
  /* landscape layout (phones turned sideways) */
  #rotate{position:fixed;inset:0;z-index:60;background:rgba(14,22,18,.95);display:none;align-items:center;justify-content:center;color:#fff;text-align:center;padding:24px}
  #rotate .rbox{display:flex;flex-direction:column;align-items:center;gap:10px;max-width:300px}
  #rotate b{font-size:20px}
  #rotate small{font-size:13px;opacity:.8}
  #rotIcon{display:flex;color:#8fe0a8;animation:rotphone 2.4s ease-in-out infinite}
  @keyframes rotphone{0%,25%{transform:rotate(0)}60%,100%{transform:rotate(-90deg)}}
  #rotGo{margin-top:8px;border:0;border-radius:99px;height:44px;padding:0 22px;background:#1e7a4c;color:#fff;font:700 14px system-ui,sans-serif}
  @media (orientation:portrait){#rotate{display:flex}}
  #rotate.gone{display:none!important}
  #rotTip{max-width:280px;line-height:1.45;opacity:.75}#rotTip b{font-size:inherit}#rotTip:empty{display:none}

  @media (orientation:landscape) and (max-height:700px){
    #top{top:calc(8px + env(safe-area-inset-top));padding:6px 14px;font-size:13px}
    #needsBtn{top:calc(8px + env(safe-area-inset-top));width:42px;height:42px}
    #panel{top:calc(56px + env(safe-area-inset-top));width:230px}
    #place{top:calc(48px + env(safe-area-inset-top))}
    #wp{top:calc(76px + env(safe-area-inset-top))}
    #phoneBtn{top:calc(8px + env(safe-area-inset-top));right:calc(12px + env(safe-area-inset-right));width:42px;height:42px}
    body.incity #phoneBtn{right:calc(124px + env(safe-area-inset-right))}
    #shopBtn{top:calc(8px + env(safe-area-inset-top));right:calc(64px + env(safe-area-inset-right));height:42px}
    #mini{top:calc(8px + env(safe-area-inset-top));right:calc(12px + env(safe-area-inset-right));width:104px;height:104px}
    #stick{width:118px;height:118px;left:calc(28px + env(safe-area-inset-left));bottom:calc(20px + env(safe-area-inset-bottom))}
    #knob{width:50px;height:50px}
    #runBtn{right:calc(24px + env(safe-area-inset-right));bottom:calc(22px + env(safe-area-inset-bottom));width:64px;height:64px}
    #act{right:calc(100px + env(safe-area-inset-right));bottom:calc(28px + env(safe-area-inset-bottom));height:52px;max-width:44vw}
    #hint{bottom:calc(10px + env(safe-area-inset-bottom));max-width:44vw;font-size:12px;padding:6px 12px}
    #toast{top:auto;bottom:calc(84px + env(safe-area-inset-bottom));transform:translate(-50%,6px)}
    #toast.show{transform:translate(-50%,0)}
    #bar{bottom:calc(12px + env(safe-area-inset-bottom))}
    #work{width:min(60vw,320px);padding:16px}

    /* the phone slides in from the right and your character stays visible on the left */
    #phone{left:auto;right:calc(10px + env(safe-area-inset-right));top:calc(8px + env(safe-area-inset-top));bottom:calc(8px + env(safe-area-inset-bottom));
      width:min(300px,40vw);height:auto;transform:translateX(125%)}
    #phone.open{transform:none}
    #panel{width:248px;padding:6px 12px 4px}.mline{padding:2px 2px 6px}.mline small{display:none}.mline .ic{width:24px;height:24px}
    .nrow{height:27px}.ni{width:22px;height:22px;border-radius:8px}.ni .ic{width:14px;height:14px}
    .clk{padding:0 0 4px}.clk b{font-size:44px}.clk span{margin-top:2px;font-size:12.5px}
    .greet{display:none}.chips{margin-bottom:10px;gap:5px}.chip{padding:4px 8px;font-size:10.5px}.chip .ic{width:12px;height:12px}
    .wid{gap:8px;margin-bottom:12px}.w{padding:9px 11px;border-radius:18px}.w b{font-size:15.5px}.w small{margin-top:3px}
    .apps{gap:12px 6px}.app{font-size:11.5px;gap:5px}.app .tile{width:50px;height:50px;border-radius:16px}.app .tile .ic{width:25px;height:25px}
    .away{margin-top:14px}
    #phNotch{top:12px;width:70px;height:16px}
    .wg .big{font-size:40px}
    .ap .tile{width:52px;height:52px;border-radius:17px}
    .grid{gap:12px 6px}

    /* the Home Store becomes a side panel */
    #shop{left:auto;right:0;top:0;bottom:0;width:min(46vw,400px);border-radius:22px 0 0 22px;padding:12px 0;display:flex;flex-direction:column;transform:translateX(105%)}
    #shop.open{transform:none}
    #tabs{flex-wrap:nowrap;overflow-x:auto;padding-bottom:10px;flex:none}
    #shop{background:#f6f1e6}
    .card{width:calc(33.3% - 8px)}
    #cards{flex-wrap:wrap;overflow-x:hidden;overflow-y:auto;justify-content:center;align-content:flex-start;flex:1;padding-bottom:12px}
  }

  /* ===== Things to do ===== */
  #todoBtn{position:fixed;left:calc(66px + env(safe-area-inset-left));top:calc(10px + env(safe-area-inset-top));height:46px;padding:0 15px 0 12px;border-radius:23px;border:0;
    background:rgba(255,255,255,.95);box-shadow:0 2px 10px rgba(30,60,40,.18);display:flex;align-items:center;gap:6px;
    font:800 13.5px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:#1d2b24;z-index:10;touch-action:manipulation}
  #todoBtn .ic{width:20px;height:20px;color:#d99a1e}
  #todoBtn:active{transform:scale(.95)}
  #todo{position:fixed;left:calc(12px + env(safe-area-inset-left));top:calc(64px + env(safe-area-inset-top));bottom:calc(12px + env(safe-area-inset-bottom));
    width:min(340px,calc(100vw - 24px));z-index:13;background:#f6f1e6;border-radius:22px;box-shadow:0 8px 28px rgba(20,40,30,.28);
    opacity:0;transform:translateX(-14px);pointer-events:none;transition:opacity .18s,transform .2s cubic-bezier(.22,1,.36,1);display:flex;flex-direction:column}
  #todo.open{opacity:1;transform:none;pointer-events:auto}
  #todoList{overflow-y:auto;padding:12px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  #todoList::-webkit-scrollbar{display:none}
  .tdh{display:flex;align-items:center;justify-content:space-between;padding:2px 4px 10px}
  .tdh b{display:block;font-size:19px;font-weight:800;letter-spacing:-.02em;color:#1d2b24}
  .tdh small{font-size:12px;color:#6b7a70;font-weight:700}
  .tdx{width:36px;height:36px;border-radius:50%;border:0;background:#fff;color:#1d2b24;display:flex;align-items:center;justify-content:center;box-shadow:0 1px 4px rgba(20,40,30,.14);padding:0}
  .tdx .ic{width:18px;height:18px}
  .td{display:flex;align-items:center;gap:11px;width:100%;border:0;background:#fff;border-radius:18px;padding:10px;margin-bottom:8px;text-align:left;font-family:inherit;color:#1d2b24;box-shadow:0 1px 3px rgba(40,50,40,.1);transition:transform .14s;touch-action:manipulation}
  .td:active{transform:scale(.97)}
  .td.no{opacity:.62}
  .tdi{width:42px;height:42px;border-radius:14px;flex:none;display:flex;align-items:center;justify-content:center;color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.3)}
  .tdi .ic{width:22px;height:22px}
  .tdt{flex:1;min-width:0}
  .tdt b{display:block;font-size:14.5px;font-weight:800;letter-spacing:-.01em;margin-bottom:4px}
  .tcs{display:flex;flex-wrap:wrap;gap:4px}
  .tc{display:inline-flex;align-items:center;gap:3px;font-size:11px;font-weight:800;padding:2px 7px;border-radius:99px;background:#eef2ef;color:#4a5a50}
  .tc .ic{width:11px;height:11px}
  .tc.up{background:#dff3e7;color:#177044}.tc.dn{background:#fbe4e1;color:#c0392f}
  .tdr{display:flex;flex-direction:column;align-items:flex-end;gap:3px;flex:none}
  .tdr em{font-style:normal;font-size:12px;font-weight:800;padding:4px 9px;border-radius:99px;background:#fdf0d6;color:#7a5410;white-space:nowrap}
  .tdr em.free{background:#dff3e7;color:#177044}
  .tdr em.no{background:#fbe4e1;color:#c0392f;max-width:112px;white-space:normal;text-align:right;line-height:1.25}
  .tdr small{font-size:11px;color:#8a968e;font-weight:700}
  #tags{position:fixed;inset:0;pointer-events:none;z-index:5;overflow:hidden}
  .tag{position:absolute;left:0;top:0;width:34px;height:34px;border-radius:50%;border:0;padding:0;background:rgba(255,255,255,.95);
    box-shadow:0 2px 8px rgba(20,40,30,.25),inset 0 0 0 2px currentColor;display:flex;align-items:center;justify-content:center;pointer-events:auto;touch-action:manipulation;will-change:transform}
  .tag .ic{width:18px;height:18px}
  .tag.no{opacity:.5}
  body.phonemode #todoBtn,body.shopmode #todoBtn,body.working #todoBtn,body.travel #todoBtn,body.phonemode #todo,body.shopmode #todo{display:none}
  body.phonemode #tags,body.shopmode #tags,body.travel #tags{display:none}

  /* ===== Transport ===== */
  .tag.veh{background:#fff7e3;box-shadow:0 2px 8px rgba(20,40,30,.28),inset 0 0 0 2px #d99a1e}
  .tag.veh.wait{animation:wbob 1s ease-in-out infinite;background:#d99a1e;color:#fff !important}
  @keyframes wbob{50%{margin-top:-5px}}
  #ride{position:fixed;left:50%;bottom:calc(14px + env(safe-area-inset-bottom));transform:translate(-50%,calc(100% + 60px));z-index:12;width:min(560px,calc(100vw - 24px));
    display:flex;align-items:center;gap:10px;padding:10px 10px 10px 12px;border-radius:22px;background:#f6f1e6;box-shadow:0 8px 26px rgba(20,40,30,.3);transition:transform .3s cubic-bezier(.22,1,.36,1)}
  #ride.open{transform:translate(-50%,0)}
  .rdt{flex:1;min-width:0}.rdt b{display:block;font-size:15px;font-weight:800;color:#1d2b24;letter-spacing:-.01em}
  .rdt small{display:block;font-size:12px;font-weight:700;color:#6b7a70;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  #ride button{border:0;border-radius:16px;height:44px;padding:0 14px;font:800 13px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;display:flex;align-items:center;gap:5px;flex:none;touch-action:manipulation}
  #ride button:active{transform:scale(.95)}
  .rbf{background:#fff;color:#1d2b24;box-shadow:0 1px 4px rgba(20,40,30,.14)}.rbf .ic{width:17px;height:17px}
  .rbd{background:linear-gradient(180deg,#e0654f,#c0392f);color:#fff}
  #ridePick{position:fixed;right:calc(12px + env(safe-area-inset-right));top:calc(12px + env(safe-area-inset-top));bottom:calc(12px + env(safe-area-inset-bottom));width:min(400px,calc(100vw - 24px));
    z-index:14;background:#f6f1e6;border-radius:22px;box-shadow:0 8px 28px rgba(20,40,30,.3);padding:12px;overflow-y:auto;opacity:0;transform:translateX(16px);pointer-events:none;transition:opacity .18s,transform .2s}
  #ridePick.open{opacity:1;transform:none;pointer-events:auto}
  .rp{display:flex;align-items:center;gap:10px;background:#fff;border-radius:18px;padding:10px;margin-bottom:8px;box-shadow:0 1px 3px rgba(40,50,40,.1)}
  .rpb{display:flex;flex-direction:column;gap:5px;flex:none}
  .rpb button{border:0;border-radius:12px;padding:7px 10px;font:800 12px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;background:#dff3e7;color:#14583a;touch-action:manipulation;white-space:nowrap}
  .rpb button.ch{background:#fdf0d6;color:#7a5410}
  .rpb button:active{transform:scale(.95)}
  body.riding #stick,body.riding #runBtn,body.riding #act,body.riding #todoBtn,body.riding #todo{display:none}

  /* ===== ride countdown ===== */
  .cdw{position:relative;width:40px;height:40px;flex:none;margin-left:auto;margin-right:8px}
  .cdw svg{width:40px;height:40px;transform:rotate(-90deg)}
  .cdw circle{fill:none;stroke-width:3.5}
  .cdb{stroke:#e2dccd}.cdf{stroke:#d99a1e;stroke-linecap:round;stroke-dasharray:97.4;stroke-dashoffset:0;transition:stroke-dashoffset .2s linear}
  .cdw b{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font:800 15px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:#7a5410}

  /* ===== big map ===== */
  #mini{cursor:pointer}
  #mini .mtap{position:absolute;left:0;right:0;bottom:0;padding:2px 0 3px;text-align:center;font:800 8.5px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:#fff;background:rgba(29,43,36,.62);pointer-events:none}
  #bigmap{position:fixed;inset:calc(8px + env(safe-area-inset-top)) calc(8px + env(safe-area-inset-right)) calc(8px + env(safe-area-inset-bottom)) calc(8px + env(safe-area-inset-left));
    z-index:16;border-radius:22px;overflow:hidden;background:#c4d8ad;box-shadow:0 10px 34px rgba(20,40,30,.35);display:none}
  #bigmap.open{display:block}
  #bigC{width:100%;height:100%;display:block;touch-action:none}
  .bmh{position:absolute;left:12px;top:12px;padding:8px 14px;border-radius:16px;background:rgba(255,255,255,.95);box-shadow:0 2px 8px rgba(20,40,30,.18);pointer-events:none;max-width:calc(100% - 90px)}
  .bmh b{display:block;font:800 15px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:#1d2b24}
  .bmh small{display:block;font:700 11px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:#6b7a70}
  #bmX{position:absolute;right:12px;top:12px;width:42px;height:42px;border-radius:50%;border:0;background:#fff;color:#1d2b24;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px rgba(20,40,30,.2);padding:0}
  #bmX .ic{width:20px;height:20px}
  .bmz{position:absolute;right:12px;top:64px;display:flex;flex-direction:column;gap:8px}
  .bmz button{width:42px;height:42px;border-radius:14px;border:0;background:#fff;color:#1d2b24;font:800 22px system-ui,sans-serif;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px rgba(20,40,30,.2);padding:0;touch-action:manipulation}
  .bmz button .ic{width:20px;height:20px}
  .bmz button:active,#bmX:active{transform:scale(.93)}
  #bmInfo{position:absolute;left:50%;bottom:12px;transform:translateX(-50%);display:flex;align-items:center;gap:10px;padding:8px 8px 8px 14px;border-radius:18px;background:rgba(255,255,255,.96);box-shadow:0 2px 10px rgba(20,40,30,.2);
    font:700 13px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:#1d2b24;white-space:nowrap;max-width:calc(100% - 24px)}
  #bmInfo span{display:flex;align-items:center;gap:6px;overflow:hidden;text-overflow:ellipsis}
  #bmInfo .ic{width:17px;height:17px;color:#d99a1e}
  #bmInfo button{border:0;border-radius:12px;padding:7px 12px;background:#fbe4e1;color:#c0392f;font:800 12px system-ui,sans-serif}
  body.bigmap #stick,body.bigmap #runBtn,body.bigmap #act,body.bigmap #todoBtn,body.bigmap #todo,body.bigmap #tags,body.bigmap #mini,body.bigmap #wp{display:none}

  /* ---------- Campus Sim: signing up ---------- */
  #signup{position:fixed;inset:0;z-index:80;display:none;overflow-y:auto;-webkit-overflow-scrolling:touch;
    background:radial-gradient(circle at 85% 8%,rgba(244,197,66,.18),transparent 34%),linear-gradient(160deg,#173d2b,#0d2218 70%);color:#fff;
    padding:calc(18px + env(safe-area-inset-top)) calc(16px + env(safe-area-inset-right)) calc(24px + env(safe-area-inset-bottom)) calc(16px + env(safe-area-inset-left))}
  #signup.on{display:block}
  body.signing>*:not(#signup):not(canvas):not(#boot){visibility:hidden}
  .subox{max-width:620px;margin:0 auto}
  .sulogo{display:flex;align-items:center;gap:10px;margin-bottom:14px}
  .sulogo .ic{width:34px;height:34px;color:#f4c542}
  .sulogo b{font-size:24px;font-weight:900;letter-spacing:-.03em}
  .sulogo small{font-size:12px;opacity:.7;font-weight:700;margin-left:4px}
  .suh{margin-bottom:14px}
  .sus{display:flex;gap:5px;margin-bottom:12px}
  .sus i{height:5px;flex:1;border-radius:3px;background:rgba(255,255,255,.18)}
  .sus i.on{background:#f4c542}
  .suh h1{margin:0;font-size:26px;font-weight:900;letter-spacing:-.03em;line-height:1.1}
  .suh p{margin:6px 0 0;font-size:14px;opacity:.78;font-weight:600;line-height:1.4}
  .sugrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px}
  .sucard{display:flex;flex-direction:column;align-items:flex-start;gap:6px;text-align:left;border:0;border-radius:22px;padding:16px;background:#f6f1e6;color:#1d2b24;font-family:inherit;box-shadow:0 6px 18px rgba(0,0,0,.25)}
  .sucard.off{opacity:.55}
  .sucard b{font-size:17px;font-weight:800}
  .sucard small{font-size:12.5px;color:#6b7a70;font-weight:600}
  .sui{width:46px;height:46px;border-radius:15px;display:flex;align-items:center;justify-content:center;color:#fff}
  .sui .ic{width:26px;height:26px}
  .suflip{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;width:100%;max-width:300px;height:200px;margin:8px auto;border:0;border-radius:26px;
    background:repeating-linear-gradient(45deg,#e0a12a 0 14px,#d79516 14px 28px);color:#fff;font-family:inherit;box-shadow:0 10px 26px rgba(0,0,0,.35);animation:suwob 1.6s ease-in-out infinite}
  .suflip span .ic{width:46px;height:46px}
  .suflip b{font-size:24px;font-weight:900}
  .suflip small{font-size:13px;font-weight:700;opacity:.9}
  @keyframes suwob{0%,100%{transform:rotate(-2deg)}50%{transform:rotate(2deg) scale(1.02)}}
  .sureveal{border-radius:26px;overflow:hidden;background:#f6f1e6;color:#1d2b24;box-shadow:0 10px 26px rgba(0,0,0,.35);animation:suin .5s cubic-bezier(.2,1.4,.4,1)}
  @keyframes suin{from{transform:rotateY(80deg) scale(.9);opacity:0}to{transform:none;opacity:1}}
  .srh{display:flex;align-items:center;gap:10px;padding:16px 18px;color:#fff;background:linear-gradient(145deg,var(--c1),var(--c2))}
  .srh .ic{width:30px;height:30px}
  .srh b{font-size:22px;font-weight:900;letter-spacing:-.02em}
  .srg{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1px;background:#e4ddcc}
  .srg div{background:#f6f1e6;padding:10px 14px}
  .srg small{display:block;font-size:11.5px;color:#6b7a70;font-weight:700}
  .srg b{font-size:14px;font-weight:800;line-height:1.3}
  .sugo{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;max-width:360px;height:54px;margin:16px auto 0;border:0;border-radius:27px;background:#f4c542;color:#1d2b24;font:900 16px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;box-shadow:0 6px 16px rgba(0,0,0,.3)}
  .sugo .ic{width:20px;height:20px}
  .sulist{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:8px}
  .surow{display:grid;grid-template-columns:14px 1fr;column-gap:10px;row-gap:2px;align-items:center;text-align:left;border:0;border-radius:18px;padding:12px 14px;background:#f6f1e6;color:#1d2b24;font-family:inherit}
  .surow .sud{width:12px;height:12px;border-radius:50%;grid-row:span 2}
  .surow b{font-size:14.5px;font-weight:800;line-height:1.25}
  .surow small{font-size:12px;color:#6b7a70;font-weight:600}
  .suback{display:inline-flex;align-items:center;gap:6px;margin-top:14px;border:0;background:rgba(255,255,255,.12);color:#fff;border-radius:99px;padding:9px 16px;font:800 13px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
  .suback .ic{width:16px;height:16px}
  .suid{display:flex;gap:14px;align-items:center;background:#f6f1e6;color:#1d2b24;border-radius:24px;padding:14px;margin-bottom:12px}
  .suid>div{display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-width:0}
  .suid b{font-size:20px;font-weight:900;letter-spacing:-.02em}
  .suid small{font-size:12.5px;color:#6b7a70;font-weight:700}
  .sushuf{display:inline-flex;align-items:center;gap:5px;border:0;background:#e9e3d4;color:#1d2b24;border-radius:99px;padding:5px 10px;font:800 11.5px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;margin:2px 0 4px}
  .sushuf .ic{width:13px;height:13px}
  #signup .sec{color:#f4c542}
  .sucourses{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:6px}
  .sucourses div{display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.08);border-radius:14px;padding:8px 10px;font-size:13.5px;font-weight:700}
  .cc{flex:none;font-size:11px;font-weight:900;letter-spacing:.02em;padding:4px 7px;border-radius:8px;background:#1e7a4c;color:#fff;white-space:nowrap}

  /* ---------- the Portal app ---------- */
  .pav{display:inline-flex;align-items:center;justify-content:center;flex:none;border-radius:50%;object-fit:cover;background:#dcebe1;box-shadow:0 0 0 3px #fff,0 3px 10px rgba(20,40,30,.2);color:#1e7a4c}
  .pav .ic{width:55%;height:55%}
  .pcard2{display:flex;flex-wrap:wrap;align-items:center;gap:10px 12px;background:#fff;border-radius:22px;padding:12px;box-shadow:0 1px 3px rgba(40,50,40,.1);margin-bottom:9px}
  .pinfo{flex:1;min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:1px}
  .pinfo b{font-size:16px;font-weight:800;letter-spacing:-.01em}
  .pinfo small{font-size:11.5px;color:#6b7a70;font-weight:600;line-height:1.3}
  .ptag{display:inline-block;margin-top:4px;font-size:11px;font-weight:800;padding:3px 9px;border-radius:99px;color:#fff}
  .pg{flex:1 1 100%;display:flex;align-items:baseline;gap:8px;background:#eef6f0;border-radius:14px;padding:7px 12px}
  .pg small{font-size:11px;font-weight:800;color:#6b7a70}
  .pg b{font-size:24px;font-weight:900;color:#1e7a4c;letter-spacing:-.03em;line-height:1.1}
  .psem{display:flex;align-items:center;gap:7px;font-size:12.5px;font-weight:700;color:#3d4c43;margin:0 2px 10px}
  .psem .ic{width:16px;height:16px;color:#1e7a4c}
  .ptabs{display:flex;gap:4px;background:#e9e3d4;border-radius:99px;padding:4px;margin-bottom:12px}
  .ptabs button{flex:1;border:0;background:transparent;border-radius:99px;padding:8px 2px;font:800 12px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:#5b675f}
  .ptabs button.on{background:#fff;color:#1d2b24;box-shadow:0 1px 3px rgba(40,50,40,.15)}
  .pnote{display:flex;gap:8px;align-items:flex-start;background:#fff6dc;border-radius:14px;padding:10px 12px;color:#7a5a12}
  .pnote .ic{width:16px;height:16px;flex:none;margin-top:1px}
  .crow{display:flex;align-items:center;gap:10px;background:#fff;border-radius:18px;padding:10px 12px;margin-bottom:7px;box-shadow:0 1px 3px rgba(40,50,40,.1)}
  .crow .rt{font-size:13.5px}
  .crow .rt small{display:flex;align-items:center;gap:4px}
  .crow .rt small .ic{width:13px;height:13px;flex:none}
  .crow.cl.now{box-shadow:0 0 0 2px #1e7a4c}
  .crow.cl.done{opacity:.7}
  .crow.cl{flex-wrap:wrap;row-gap:6px}
  .crow.cl .rt{flex:1 1 0;min-width:0}
  .crow.cl .rt b{display:block;line-height:1.25}
  .cfoot{flex:1 0 100%;display:flex;align-items:center;gap:8px;padding-left:62px}
  .cfoot .cgo{margin-left:auto}
  .ct{flex:none;width:52px;display:flex;flex-direction:column;align-items:flex-start}
  .ct b{font-size:13px;font-weight:900}
  .ct small{font-size:10.5px;color:#8a968e;font-weight:700}
  .cs{flex:none;font-size:11px;font-weight:800;padding:4px 9px;border-radius:99px;background:#eef1ee;color:#5b675f}
  .cs.now{background:#1e7a4c;color:#fff}
  .cs.done{background:#fbe4e1;color:#c0392f}
  .ca{flex:none;text-align:right;font-size:15px;font-weight:900;color:#1e7a4c}
  .ca small{display:block;font-size:10px;color:#8a968e;font-weight:700}
  .gr{flex:none;width:34px;height:34px;border-radius:11px;display:flex;align-items:center;justify-content:center;font-size:17px;font-weight:900;color:#fff;background:#1e7a4c}
  .gr.gB{background:#27935b}.gr.gC{background:#c9a227}.gr.gD{background:#e0753a}.gr.gE{background:#c96a3a}.gr.gF{background:#c0392f}
  /* Lapo's phone has seen better days */
  #phone.cracked #scr::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:30;opacity:.55;
    background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 200' preserveAspectRatio='none'%3E%3Cg fill='none' stroke='%23ffffff' stroke-width='.45' stroke-linecap='round'%3E%3Cpath d='M78 0L70 22l9 9-14 20 6 13-10 18'/%3E%3Cpath d='M70 22l-16 6-7 15M79 31l21 4M65 51l-19 3-9 12M71 64l29 9'/%3E%3Cpath d='M61 82l-12 7M54 28l-12-6'/%3E%3C/g%3E%3C/svg%3E") no-repeat;background-size:100% 100%}

  /* always-there close button at the top of the phone */
  #phClose{position:absolute;z-index:6;top:50px;right:14px;width:36px;height:36px;border-radius:50%;border:0;padding:0;display:flex;align-items:center;justify-content:center;
    background:rgba(255,255,255,.22);color:#fff;box-shadow:0 1px 5px rgba(0,0,0,.18);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
  #phClose .ic{width:19px;height:19px}
  #scr.light #phClose{background:#fff;color:#1d2b24}
  .appv .ah{padding-right:44px}
  .sunm{flex:1}
  .sunm label{font-size:11.5px;font-weight:800;color:#6b7a70}
  .sunm input{width:100%;box-sizing:border-box;font:900 19px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:#1d2b24;background:#fff;border:2px solid #d9d1bd;border-radius:14px;padding:8px 12px;margin:3px 0 4px;outline:none}
  .sunm input:focus{border-color:#1e7a4c}
  .suerr{color:#c0392f!important;min-height:0}
  .cs.att{background:#dff3e7;color:#177044}
  .cgo{flex:none;display:inline-flex;align-items:center;gap:3px;border:0;border-radius:99px;padding:5px 9px;background:#1e7a4c;color:#fff;font:800 11px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
  .cgo .ic{width:13px;height:13px}
  .pcard .pc-x{margin-right:42px}
  /* the map app: quick picks and a way back to the list */
  .qchips{display:flex;gap:7px;overflow-x:auto;padding:2px 2px 8px;margin:0 -2px 6px;scrollbar-width:none}
  .qchips::-webkit-scrollbar{display:none}
  .qchip{flex:none;display:inline-flex;align-items:center;gap:7px;border:0;border-radius:99px;padding:6px 13px 6px 6px;background:#fff;color:#1d2b24;font:800 12.5px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;box-shadow:0 1px 3px rgba(40,50,40,.14)}
  .qchip span{width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff}
  .qchip span .ic{width:15px;height:15px}
  .qback{display:inline-flex;align-items:center;gap:5px;border:0;border-radius:99px;padding:7px 13px 7px 9px;margin-bottom:9px;background:#e9e3d4;color:#1d2b24;font:800 12.5px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
  .qback .ic{width:15px;height:15px}
  /* hints: one small card under the clock */
  #tip{position:fixed;left:50%;top:calc(88px + env(safe-area-inset-top));z-index:15;transform:translate(-50%,-14px);opacity:0;pointer-events:none;
    display:flex;align-items:center;gap:9px;width:max-content;max-width:min(440px,calc(100vw - 230px));padding:8px 8px 8px 10px;border-radius:18px;
    background:rgba(255,255,255,.96);color:#1d2b24;box-shadow:0 6px 20px rgba(20,40,30,.22);transition:opacity .25s,transform .25s}
  #tip.on{opacity:1;transform:translate(-50%,0);pointer-events:auto}
  #tip .ti{flex:none;width:30px;height:30px;border-radius:10px;background:#1e7a4c;color:#fff;display:flex;align-items:center;justify-content:center}
  #tip .ti .ic{width:17px;height:17px}
  #tip .tt{font-size:12.5px;line-height:1.35;font-weight:700}
  #tip .ta{flex:none;border:0;border-radius:99px;padding:7px 12px;background:#1e7a4c;color:#fff;font:800 12px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;white-space:nowrap}
  #tip .tx{flex:none;width:26px;height:26px;border-radius:50%;border:0;background:#eef2ef;color:#5b675f;display:flex;align-items:center;justify-content:center;padding:0}
  #tip .tx .ic{width:13px;height:13px}
  body.phonemode #tip,body.signing #tip,body.bigmap #tip{display:none}
  #tip .ti.bad{background:#c0392f}
  .pcard .pc-t small{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .pcard .pc-x{display:none}
  .pcard .pc-t b{font-size:16px}
/* Stage 3: the Housing app */
.hcard{display:flex;gap:12px;align-items:center;background:#fff;border-radius:18px;padding:12px;margin:4px 0 8px;box-shadow:0 1px 3px rgba(0,0,0,.06)}
.hcard .rt{display:flex;flex-direction:column;gap:2px;min-width:0}
.hcard .rt b{font-size:15px}.hcard .rt small{color:#6b747c;font-size:12.5px}
.psem.bad{background:#fbe3e0;color:#9c2a1e;padding:8px 10px;border-radius:12px}.psem.bad .ic{color:#9c2a1e}
.harea{font-weight:800;font-size:14px;margin:12px 2px 4px;display:flex;flex-direction:column}
.harea small{font-weight:500;color:#6b747c;font-size:12px}
.mav{color:#fff;font-weight:800;font-size:17px}
.hconf{background:#fff7e6;border:1.5px solid #e0a548;border-radius:16px;padding:12px;margin:4px 0 10px;display:flex;flex-direction:column;gap:6px}
.hconf b{font-size:15px}.hconf span{font-size:13px;color:#5a4a2a;line-height:1.35}
.hbtns{display:flex;gap:8px;margin-top:4px}
.hbtns button{flex:1;border:0;border-radius:12px;padding:10px;font:inherit;font-weight:700;background:#ebe5d8;color:#3a3226}
.hbtns button.ok{background:#1e7a4c;color:#fff}
.mst{font-weight:700;color:#8a6a3a!important}.mst.in{color:#1e7a4c!important}
/* Stage 4: flashcards after lectures and in exams */
#quiz{position:fixed;inset:0;z-index:60;display:none;align-items:center;justify-content:center;background:rgba(14,22,18,.55);padding:12px;backdrop-filter:blur(2px)}
#quiz.on{display:flex}
.qcard{width:min(580px,100%);max-height:100%;overflow:auto;background:#fbf8f1;border-radius:24px;padding:16px 18px 18px;box-shadow:0 10px 40px rgba(0,0,0,.35);animation:qin .25s ease-out}
@keyframes qin{from{transform:translateY(14px) scale(.97);opacity:0}to{transform:none;opacity:1}}
.qtop{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}
.qtop small{font-weight:800;color:#1e7a4c;font-size:12.5px;letter-spacing:.02em}
.qdots{display:flex;gap:4px}.qdots i{width:8px;height:8px;border-radius:50%;background:#ddd5c4}.qdots i.d{background:#1e7a4c}.qdots i.c{background:#e0a548}
.qq{font-size:18px;font-weight:800;color:#1d2b24;line-height:1.3;margin:2px 2px 12px}
.qopts{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.qopts button{border:2px solid #e3dccb;background:#fff;border-radius:14px;padding:11px 10px;font:inherit;font-size:14.5px;font-weight:700;color:#28332c;text-align:left;min-height:48px;cursor:pointer}
.qopts button:active{transform:scale(.98)}
.qopts button.ok{background:#e1f4e8;border-color:#1e7a4c;color:#145a36}
.qopts button.no{background:#fbe3e0;border-color:#c0392f;color:#8e2a20}
.qopts button.dim{opacity:.5}
.qnext{display:block;width:100%;margin-top:12px;border:0;border-radius:14px;padding:12px;background:#1e7a4c;color:#fff;font:inherit;font-weight:800;font-size:15px}
.qend{text-align:center;display:flex;flex-direction:column;align-items:center;gap:4px}
.qend small{font-weight:800;color:#1e7a4c}.qend b{font-size:17px}.qend p{margin:4px 0 0;color:#5a6660;font-size:14px}
.qgrade{width:84px;height:84px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:44px;font-weight:900;color:#fff;margin:6px 0;background:#27935b}
.qgrade.gA{background:#1e7a4c}.qgrade.gC{background:#c9a227}.qgrade.gD{background:#e0753a}.qgrade.gE{background:#c96a3a}.qgrade.gF{background:#c0392f}
body.quizzing #hud,body.quizzing #tip{visibility:hidden}
.ca .cf{display:block;margin-top:4px;color:#1e7a4c}
@media (max-height:430px){.qcard{padding:12px 14px 14px}.qq{font-size:16px;margin-bottom:9px}.qopts button{padding:8px 10px;min-height:40px;font-size:13.5px}.qnext{margin-top:9px;padding:10px}}
.qopts button.xo{text-decoration:line-through;opacity:.4;background:#f1ece2}
.qhelp{display:block;margin-top:8px;font-size:12px;font-weight:700;color:#8a6a3a}
  /* online: sign in / create account */
  .autabs{max-width:360px;margin:6px auto 12px}
  .aufrm{max-width:360px;margin:0 auto;display:flex;flex-direction:column;gap:6px;background:#f6f1e6;color:#1d2b24;border-radius:24px;padding:18px;box-shadow:0 8px 22px rgba(0,0,0,.3)}
  .aufrm label{font-size:12px;font-weight:800;color:#5b675f;margin-top:4px}
  .aufrm input{height:46px;border:2px solid #e2dbc9;border-radius:14px;padding:0 14px;font:700 16px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:#1d2b24;background:#fff;outline:none;-webkit-appearance:none}
  .aufrm input:focus{border-color:#f4c542}
  .aufrm .sugo{margin-top:8px;max-width:none}
  .aufrm .sugo[disabled]{opacity:.65}
  .aufrm .note{margin:8px 0 0;font-size:12px}
  .aufrm .suerr{font-size:12.5px;font-weight:700;line-height:1.35}
  .auspin{width:42px;height:42px;margin:30px auto;border-radius:50%;border:4px solid rgba(255,255,255,.2);border-top-color:#f4c542;animation:auspin 1s linear infinite}
  @keyframes auspin{to{transform:rotate(360deg)}}
  /* online: other players' name tags (tap to chat) */
  .nmtag{position:absolute;left:0;top:0;display:flex;align-items:center;gap:6px;max-width:180px;height:28px;padding:0 10px 0 8px;margin-top:-4px;border:0;border-radius:14px;
    background:rgba(16,30,22,.8);color:#fff;font:800 13px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;white-space:nowrap;pointer-events:auto;touch-action:manipulation;box-shadow:0 2px 8px rgba(0,0,0,.25)}
  .nmtag i{width:9px;height:9px;border-radius:50%;background:#7fd6a4;flex:none}
  .nmtag.nepo i{background:#f4c542}
  .nmtag span{overflow:hidden;text-overflow:ellipsis}
  .nmtag em{display:none;width:18px;height:18px;margin-left:2px;color:#f4c542}
  .nmtag em .ic{width:18px;height:18px}
  .nmtag.close em{display:block}
  .nmtag.far{opacity:.75;transform-origin:50% 100%;font-size:11.5px;height:24px}
  body.riding #tags .nmtag{pointer-events:none}
  /* the Players app: near you, chats, friends */
  .pbadge{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:#d23f37;color:#fff;font:800 11px system-ui,sans-serif;font-style:normal;vertical-align:1px}
  .nearhd{display:flex;align-items:center;gap:8px;background:#fff;border-radius:18px;padding:12px 14px;margin-bottom:10px;color:#1d2b24;box-shadow:0 1px 3px rgba(40,50,40,.1)}
  .nearhd .ic{width:22px;height:22px;color:#7a4fb5}
  .nearhd b{font-size:22px;font-weight:900}
  .nearhd span{font-size:13px;font-weight:700;color:#5b675f}
  .plrow .rs.dim{color:#8a948e;font-weight:700;font-size:11.5px;background:none}
  .frb{display:flex;gap:6px;flex:none}
  .frb button,.cbtns button{border:0;border-radius:99px;padding:8px 12px;background:#e9e3d4;color:#1d2b24;font:800 12px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;display:inline-flex;align-items:center;gap:5px}
  .frb button.ok,.cbtns button.ok{background:#1e7a4c;color:#fff}
  .cbtns button.on{background:#dff1e6;color:#1e7a4c}
  .cbtns button.armed{background:#c0392f;color:#fff}
  .cbtns button[disabled]{opacity:.6}
  .cbtns button .ic{width:15px;height:15px}
  .odot{display:inline-block;width:11px;height:11px;border-radius:50%;background:#c3cbc6}
  .odot.on{background:#27a862;box-shadow:0 0 0 3px rgba(39,168,98,.2)}
  /* one conversation */
  .chatv{display:flex;flex-direction:column;min-height:100%}
  .chd{display:flex;align-items:center;gap:10px;margin-bottom:8px}
  .chd .rt b{display:block;font-size:15px}
  .chd .rt small{color:#6b7a70;font-weight:700;font-size:12px}
  .cbtns{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:8px}
  .cnote{background:#fff7e3;color:#7a5a1a;border-radius:14px;padding:9px 12px;font-size:12.5px;font-weight:700;line-height:1.35;margin-bottom:8px}
  .cnote.bad{background:#fde8e6;color:#a8322a}
  .bubs{flex:1;display:flex;flex-direction:column;gap:6px;min-height:120px;max-height:46vh;overflow-y:auto;padding:4px 2px 8px;-webkit-overflow-scrolling:touch}
  .bub{max-width:80%;align-self:flex-start;background:#fff;color:#1d2b24;border-radius:16px 16px 16px 4px;padding:8px 11px;box-shadow:0 1px 2px rgba(40,50,40,.1)}
  .bub.me{align-self:flex-end;background:#1e7a4c;color:#fff;border-radius:16px 16px 4px 16px}
  .bub span{display:block;font-size:14px;font-weight:600;line-height:1.35;white-space:pre-wrap;word-break:break-word}
  .bub small{display:block;font-size:10.5px;opacity:.6;font-weight:700;margin-top:2px;text-align:right}
  .cin{display:flex;gap:8px;position:sticky;bottom:0;padding:8px 0 2px;background:inherit}
  .cin input{flex:1;min-width:0;height:44px;border:2px solid #e2dbc9;border-radius:22px;padding:0 14px;font:600 15px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:#1d2b24;background:#fff;outline:none;-webkit-appearance:none}
  .cin input:focus{border-color:#1e7a4c}
  .cin button{width:44px;height:44px;flex:none;border:0;border-radius:50%;background:#1e7a4c;color:#fff;display:flex;align-items:center;justify-content:center}
  .cin button[disabled],.cin input[disabled]{opacity:.5}
  .cin button .ic{width:20px;height:20px}
  .lifedot{display:inline-block;width:9px;height:9px;border-radius:50%;background:#2fa86a;margin-right:5px;vertical-align:0}
  .lifedot.nepo{background:#e0a12a}
  .chatv .cbtns{margin-bottom:6px}
  .chatv .cnote{padding:7px 11px;margin-bottom:6px}
  /* the roadside Ride button and its menu */
  #rideBtn{position:fixed;right:calc(26px + env(safe-area-inset-right));bottom:calc(196px + env(safe-area-inset-bottom));height:44px;padding:0 14px 0 10px;border:0;border-radius:22px;
    background:#e0a12a;color:#fff;font:900 14px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;display:none;align-items:center;gap:6px;z-index:10;box-shadow:0 3px 12px rgba(20,50,35,.3);touch-action:manipulation}
  #rideBtn.on{display:flex}
  #rideBtn .ic{width:22px;height:22px}
  #rideMenu{position:fixed;right:calc(26px + env(safe-area-inset-right));bottom:calc(248px + env(safe-area-inset-bottom));display:none;flex-direction:column;gap:6px;z-index:11}
  #rideMenu.open{display:flex}
  #rideMenu button{display:grid;grid-template-columns:28px auto;column-gap:8px;align-items:center;text-align:left;border:0;border-radius:16px;padding:8px 14px 8px 10px;background:#fff;color:#1d2b24;box-shadow:0 3px 10px rgba(20,50,35,.25);font-family:inherit}
  #rideMenu button .ic{grid-row:span 2;width:24px;height:24px;color:#d99a1e}
  #rideMenu b{font-size:14px;font-weight:800}
  #rideMenu small{font-size:11.5px;font-weight:700;color:#6b7a70}
  .tag.veh{width:42px;height:42px}
  @media (orientation:landscape) and (max-height:700px){
    #rideBtn{right:calc(24px + env(safe-area-inset-right));bottom:calc(98px + env(safe-area-inset-bottom))}
    #rideMenu{right:calc(24px + env(safe-area-inset-right));bottom:calc(150px + env(safe-area-inset-bottom));flex-direction:row}
  }
  body.riding #rideBtn,body.phonemode #rideBtn{display:none}
  /* who is riding with you (tap to chat) */
  .rwho{display:flex;gap:6px;flex-wrap:nowrap;overflow-x:auto;max-width:42%}
  #ride .rwho button{height:36px;padding:0 10px;border-radius:14px;font-size:12px}
  .rwho .ic{width:15px;height:15px}
  /* riding in a friend's car */
  #carBar{position:fixed;left:50%;bottom:calc(14px + env(safe-area-inset-bottom));transform:translate(-50%,calc(100% + 60px));z-index:12;width:min(560px,calc(100vw - 24px));
    display:flex;align-items:center;gap:8px;padding:10px 10px 10px 12px;border-radius:22px;background:#f6f1e6;box-shadow:0 8px 26px rgba(20,40,30,.3);transition:transform .3s cubic-bezier(.22,1,.36,1)}
  #carBar.open{transform:translate(-50%,0)}
  #carBar button{border:0;border-radius:16px;height:44px;padding:0 14px;font:800 13px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;flex:none;touch-action:manipulation}
  #carBar button.ok{background:#1e7a4c;color:#fff}
  #carBar button[disabled]{opacity:.5}
  body.riding #carBar{bottom:calc(84px + env(safe-area-inset-bottom))}
  body.incar #stick,body.incar #runBtn,body.incar #act,body.incar #todoBtn,body.incar #todo,body.incar #rideBtn{display:none}
  #carBar:not(.open){visibility:hidden}
  /* voice: the mic button, and a mic on the name tag of someone who is talking */
  #micBtn{position:fixed;left:calc(40px + env(safe-area-inset-left));bottom:calc(178px + env(safe-area-inset-bottom));width:50px;height:50px;border-radius:50%;border:0;padding:0;
    background:#fff;color:#5b675f;display:none;align-items:center;justify-content:center;z-index:10;box-shadow:0 3px 12px rgba(20,50,35,.28);touch-action:manipulation}
  #micBtn.show{display:flex}
  #micBtn .ic{width:24px;height:24px}
  #micBtn.on{background:#1e7a4c;color:#fff;animation:micp 1.6s ease-in-out infinite}
  @keyframes micp{0%,100%{box-shadow:0 0 0 0 rgba(39,168,98,.5)}50%{box-shadow:0 0 0 9px rgba(39,168,98,0)}}
  @media (orientation:landscape) and (max-height:700px){#micBtn{left:calc(48px + env(safe-area-inset-left));bottom:calc(150px + env(safe-area-inset-bottom));width:46px;height:46px}}
  .nmtag u{display:none;width:16px;height:16px;color:#7fd6a4;text-decoration:none}
  .nmtag u .ic{width:16px;height:16px}
  .nmtag.mic u{display:block}
  .nmtag.talk u{color:#f4c542;animation:micb .8s ease-in-out infinite}
  @keyframes micb{50%{transform:scale(1.25)}}
  .vaudio{display:none}
  /* the people in your vehicle: one small button, and its list */
  #ride .rppl{height:40px;padding:0 12px;border-radius:14px;font-size:13px}
  #ride .rppl .ic{width:18px;height:18px}
  #rideWho{position:fixed;left:50%;bottom:calc(84px + env(safe-area-inset-bottom));transform:translateX(-50%);z-index:13;width:min(360px,calc(100vw - 24px));
    background:#fff;border-radius:18px;box-shadow:0 8px 26px rgba(20,40,30,.3);padding:10px 12px;display:none}
  #rideWho.open{display:block}
  #rideWho>b{display:block;font-size:13px;font-weight:800;color:#5b675f;margin-bottom:6px}
  #rideWho .wrow{display:flex;align-items:center;gap:8px;padding:5px 0;border-top:1px solid #eee7d8}
  #rideWho .wrow span{flex:1;font-weight:800;font-size:14px;color:#1d2b24;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  #rideWho button{border:0;border-radius:12px;height:34px;padding:0 10px;font:800 12px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;background:#e9e3d4;color:#1d2b24;display:inline-flex;align-items:center;gap:4px}
  #rideWho button.out{background:#c0392f;color:#fff}
  #rideWho button .ic{width:15px;height:15px}
  .rwho{max-width:none}
  /* ---------- chat: a bigger chat button on names, replies, ticks, the message menu ---------- */
  .nmtag{height:32px}
  .nmtag em{display:flex;align-items:center;justify-content:center;width:26px;height:26px;margin:0 -6px 0 2px;border-radius:50%;background:rgba(244,197,66,.18)}
  .nmtag em .ic{width:17px;height:17px}
  .nmtag.far em{display:none}
  .bub{cursor:pointer;-webkit-user-select:none;user-select:none;transition:box-shadow .15s,transform .15s}
  .bub.sel{box-shadow:0 0 0 3px rgba(224,165,72,.85)}
  .bub.flash{animation:bflash 1.2s ease}
  @keyframes bflash{0%,60%{box-shadow:0 0 0 4px rgba(224,165,72,.9)}100%{box-shadow:none}}
  .bub .q{display:block;border-left:3px solid #e0a548;background:rgba(30,60,40,.07);border-radius:8px;padding:4px 8px;margin:0 0 5px;max-width:100%}
  .bub.me .q{background:rgba(255,255,255,.16);border-left-color:#f4d27a}
  .bub .q b{display:block;font-size:11.5px;font-weight:800;color:#a0652a}
  .bub.me .q b{color:#f4d27a}
  .bub .q i{display:block;font-style:normal;font-size:12.5px;font-weight:600;opacity:.8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .bub.del span{font-style:italic;opacity:.7;font-weight:600}
  .bub .tk{font-style:normal;letter-spacing:-2px;margin-left:3px}
  .bub .tk.rd{color:#9fe0ff}
  .cempty{margin:auto;text-align:center;color:#6b7a70;font-size:13px;font-weight:700;padding:20px 14px}
  .cact{display:none;gap:6px;flex-wrap:wrap;padding:6px 0 2px}
  .cact.on{display:flex}
  .cact button{flex:1;min-width:0;height:40px;border:0;border-radius:12px;background:#fff;color:#1d2b24;font:800 13px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;display:flex;align-items:center;justify-content:center;gap:5px;box-shadow:0 1px 3px rgba(40,50,40,.15)}
  .cact button .ic{width:16px;height:16px}
  .cact button.bad{color:#c0392f}.cact button.armed{background:#c0392f;color:#fff}
  .cact button.cx{flex:none;width:40px}
  .crep{display:none;align-items:center;gap:8px;margin-top:6px;background:#fff;border-radius:12px;padding:6px 6px 6px 10px;border-left:4px solid #e0a548}
  .crep.on{display:flex}
  .crep div{flex:1;min-width:0}
  .crep b{display:block;font-size:12px;color:#a0652a}
  .crep i{display:block;font-style:normal;font-size:13px;font-weight:600;color:#3a4a40;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .crep button{width:32px;height:32px;border:0;border-radius:50%;background:#f1ece0;display:flex;align-items:center;justify-content:center}
  .crep button .ic{width:15px;height:15px}
  .cin textarea{flex:1;min-width:0;min-height:44px;max-height:104px;resize:none;border:2px solid #e2dbc9;border-radius:22px;padding:10px 14px;
    font:600 16px/1.3 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:#1d2b24;background:#fff;outline:none;-webkit-appearance:none;overflow-y:auto}
  .cin textarea:focus{border-color:#1e7a4c}
  .cin textarea[disabled]{opacity:.5}
  .cin{align-items:flex-end}
  /* on a phone a conversation fills the screen and stays right above the keyboard */
  body.chatfs #phone{left:var(--vvl,0px);right:auto;top:var(--vvt,0px);bottom:auto;width:var(--vvw,100%);max-width:100vw;height:var(--vvh,100%);padding:0;border-radius:0;transform:none!important;transition:none;z-index:70}
  body.chatfs #phone::before,body.chatfs #phone::after,body.chatfs #sb,body.chatfs #homeBar,body.chatfs #scr .wp{display:none}
  body.chatfs #scr{border-radius:0;background:#f6f1e6}
  body.chatfs #phoneBody{display:flex;flex-direction:column;overflow:hidden}
  body.chatfs .chatv{flex:1;min-height:0;height:100%;padding:calc(6px + env(safe-area-inset-top)) calc(12px + env(safe-area-inset-right)) calc(8px + env(safe-area-inset-bottom)) calc(12px + env(safe-area-inset-left))}
  body.chatfs .chatv .ah{margin-bottom:4px}
  body.chatfs .bubs{max-height:none;flex:1;min-height:0}
  body.chatfs .bub{max-width:72%}
  body.chatfs .bub span{font-size:15px}
  body.chatfs .cin{box-sizing:border-box;width:100%;max-width:100%}
  body.chatfs .cin button{flex:none}
  /* typing: the keyboard is up, so only the last messages and the box show (the buttons come back when you finish) */
  .ctyn{display:none}
  body.chatfs.ctype .chatv .ah,body.chatfs.ctype #chHead,body.chatfs.ctype .cact{display:none!important}
  body.chatfs.ctype .ctyn{display:flex;align-items:center;gap:8px;font:800 13px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:#1d2b24;padding:2px 2px 4px}
  body.chatfs.ctype .ctyn button{margin-left:auto;border:0;background:#e9e3d4;border-radius:12px;height:28px;padding:0 12px;font:800 12px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:#1d2b24}
  body.chatfs.ctype .chatv{padding-top:4px;padding-bottom:4px}
  body.chatfs.ctype #phClose{display:none}
  body.chatfs.ctype .crep{margin-top:2px}
  @media (orientation:landscape){body.chatfs .chatv{padding-right:max(16px,env(safe-area-inset-right));padding-left:max(12px,env(safe-area-inset-left))}}
  /* ---------- the Bank app ---------- */
  .pay.bk{background:linear-gradient(140deg,#1e5a8a,#0f3a5e)}
  .bkfr{display:flex;gap:8px;overflow-x:auto;padding:2px 0 8px;scrollbar-width:none}
  .bkfr button{flex:none;width:76px;border:0;background:#fff;border-radius:14px;padding:8px 4px;display:flex;flex-direction:column;align-items:center;gap:5px;font:800 11.5px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:#1d2b24;box-shadow:0 1px 3px rgba(40,50,40,.12)}
  .bkfr button span{max-width:68px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .bkuser{display:flex;gap:8px;margin:4px 0 6px}
  .bkuser input,.bknote{flex:1;min-width:0;height:44px;border:2px solid #e2dbc9;border-radius:14px;padding:0 12px;font:600 16px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:#1d2b24;background:#fff;outline:none}
  .bknote{width:100%;margin:8px 0 10px;box-sizing:border-box}
  .bkuser button{height:44px;padding:0 16px;border:0;border-radius:14px;background:#1e5a8a;color:#fff;font:800 14px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
  .bkamt{display:flex;align-items:center;gap:6px;background:#fff;border:2px solid #e2dbc9;border-radius:16px;padding:0 14px;height:58px}
  .bkamt span{font:900 24px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:#1e5a8a}
  .bkamt input{flex:1;min-width:0;border:0;outline:none;font:900 26px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:#1d2b24;background:none}
  .bkq{display:flex;gap:6px;margin-top:8px}
  .bkq button{flex:1;height:34px;border:0;border-radius:10px;background:#e7eef5;color:#1e5a8a;font:800 12px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
  .bksel .rs{border:0;background:#e7eef5;color:#1e5a8a;border-radius:10px;padding:6px 10px;font-weight:800}
  .bkdone{display:flex;flex-direction:column;align-items:center;gap:4px;padding:22px 0 16px;color:#1e7a4c}
  .bkdone .ic{width:44px;height:44px}
  .bkdone b{font-size:22px;color:#1d2b24}.bkdone span{font-weight:700;color:#6b7a70}
  .go.alt{background:#e7e1d2;color:#1d2b24;margin-top:8px}

  /* emotes: the small button over your head and the dance picker (54-emotes.js) */
  #emoBtn{position:absolute;left:0;top:0;display:none;align-items:center;justify-content:center;width:28px;height:28px;padding:0;border-radius:50%;
    border:1.5px solid rgba(255,255,255,.85);background:rgba(24,18,36,.62);color:#fff;pointer-events:auto;cursor:pointer;
    box-shadow:0 2px 6px rgba(0,0,0,.25);-webkit-tap-highlight-color:transparent}
  #emoBtn .ic{width:15px;height:15px}
  #emoBtn.on{background:#c13fd6;border-color:#fff}
  #emoPick{position:fixed;left:0;top:0;z-index:40;display:none;align-items:center;gap:5px;padding:5px;border-radius:16px;background:rgba(255,255,255,.96);
    box-shadow:0 6px 18px rgba(20,10,30,.28);pointer-events:auto}
  #emoPick b{font-size:11px;font-weight:800;color:#8a6a3a;padding:0 4px 0 6px;text-transform:uppercase;letter-spacing:.04em}
  #emoPick button{display:flex;align-items:center;gap:6px;border:0;border-radius:12px;background:#f3eef8;color:#2a1d36;font:800 13px system-ui,sans-serif;
    padding:8px 11px 8px 7px;cursor:pointer;white-space:nowrap}
  #emoPick button i{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;background:#c13fd6;color:#fff;
    font-style:normal;font-size:11px}
  #emoPick button:active{background:#e6dbf0}

  /* male or female, on the create-account form (and the offline sign-up) */
  .augen{display:flex;gap:8px}
  .augen button{flex:1;height:44px;border:2px solid #e2dbc9;border-radius:14px;background:#fff;color:#1d2b24;font:800 15px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;cursor:pointer}
  .augen button.on{border-color:#1e7a4c;background:#e3f3ea;color:#145c38}
  .sunm .augen{margin:6px 0 2px}
  .sunm .augen button{height:36px;font-size:13.5px}

  /* the Portal: school fees and the student ID card (55-campus2.js) */
  .pfee{background:#fff4e0;color:#8a5a12;padding:8px 10px;border-radius:12px}
  .pfee.ok{background:#e3f3ea;color:#145c38}
  .pfee span{flex:1}
  .idbtn{display:inline-flex;align-items:center;gap:5px;border:0;border-radius:99px;background:#1e7a4c;color:#fff;font:800 12px system-ui,sans-serif;padding:6px 11px;cursor:pointer}
  .idbtn .ic{width:14px;height:14px}
  .idcard{margin:10px 0;border-radius:18px;overflow:hidden;background:#fff;box-shadow:0 6px 18px rgba(20,40,30,.18);border:1px solid #d9e6dd}
  .idcard .idh{display:flex;align-items:center;gap:8px;flex-wrap:wrap;background:linear-gradient(135deg,#1e7a4c,#0f4a2c);color:#fff;padding:10px 14px}
  .idcard .idh b{font-size:14px;letter-spacing:.04em}
  .idcard .idh small{flex-basis:100%;font-size:11px;opacity:.85;font-weight:700}
  .idcard .idb{display:flex;gap:12px;padding:12px 14px;align-items:center}
  .idcard .idb b{display:block;font-size:16px}
  .idcard .idb small{display:block;font-size:12px;color:#5b675f;font-weight:700}
  .idcard .idf{background:#f3efe4;font-size:11px;font-weight:800;color:#8a6a3a;padding:7px 14px}

  /* Swag Kulture and your wardrobe (56-fashion.js) */
  .dripv .drtabs{display:flex;gap:6px;overflow-x:auto;padding:2px 0 10px;margin:0 -2px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .dripv .drtabs::-webkit-scrollbar{display:none}
  .dripv .drtabs button{flex:none;border:0;border-radius:99px;background:#efe9dc;color:#3d4c43;font:800 12.5px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;padding:8px 13px;cursor:pointer}
  .dripv .drtabs button.on{background:#16181c;color:#ffd27a}
  .dripv .drgrid{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding-bottom:84px}
  .dripv .drcard{display:flex;flex-direction:column;align-items:flex-start;gap:3px;text-align:left;border:2px solid transparent;border-radius:16px;background:#fff;
    padding:10px;box-shadow:0 1px 3px rgba(40,50,40,.1);cursor:pointer;min-height:96px;font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
  .dripv .drcard b{font-size:12.5px;font-weight:800;color:#1d2b24;line-height:1.25}
  .dripv .drcard small{font-size:11.5px;font-weight:700;color:#8a6a3a}
  .dripv .drcard.on{border-color:#1e7a4c;background:#f0f8f3}
  .dripv .drcard.on small{color:#1e7a4c}
  .dripv .drcard.sel{border-color:#16181c;box-shadow:0 4px 12px rgba(20,20,30,.18)}
  .dripv .sw{display:flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:11px;font-style:normal;flex:none;
    box-shadow:inset 0 0 0 1px rgba(0,0,0,.12);margin-bottom:3px}
  .dripv .sw b{font:900 12px serif;color:inherit}
  .dripv .sw.ank{background:conic-gradient(#f0c24a 0 25%,#1e7a4c 0 50%,#f6f1e7 0 75%,#c23b2e 0)}
  .dripv .sw.ank.a1{background:conic-gradient(#e8742c 0 25%,#0a7f86 0 50%,#f2c94c 0 75%,#3b1f4a 0)}
  .dripv .sw.ank.a2{background:conic-gradient(#1f4e8c 0 25%,#c8522a 0 50%,#f6f1e7 0 75%,#f2c94c 0)}
  .dripv .sw.ank.a3{background:conic-gradient(#f2c94c 0 25%,#5b2a6e 0 50%,#3fa36b 0 75%,#f6f1e7 0)}
  .dripv .sw.ank.a4{background:conic-gradient(#7a2f2a 0 25%,#e0a548 0 50%,#1d2b24 0 75%,#f6f1e7 0)}
  .dripv .sw.ank.a5{background:conic-gradient(#d6567f 0 25%,#2f3f58 0 50%,#f2c94c 0 75%,#8fe0ff 0)}
  .dripv .drbar{position:sticky;bottom:6px;display:flex;align-items:center;gap:10px;background:#16181c;color:#fff;border-radius:18px;padding:10px 10px 10px 14px;
    box-shadow:0 8px 20px rgba(0,0,0,.3);margin-top:-74px}
  .dripv .drbar span{flex:1;min-width:0}
  .dripv .drbar b{display:block;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .dripv .drbar small{font-size:12px;color:#ffd27a;font-weight:700}
  .dripv .drbar .go{margin:0;width:auto;flex:none;padding:0 16px;height:42px;background:#ffd27a;color:#16181c}
  .dripv .drbar .go[disabled]{opacity:.5}
  .dripv .droffbar{display:block;width:calc(100% - 4px);margin:2px 2px 8px;padding:9px 12px;border:0;border-radius:14px;background:#16181c;color:#ffd27a;font:700 13px system-ui,sans-serif;text-align:left}
  .dripv .drbar .drnote{display:block;font-size:11px;color:#c9cdd2;font-style:normal}

  .gfxr{display:flex;gap:6px;margin:4px 0 12px}
  .gfxr button{flex:1;height:40px;border:0;border-radius:12px;background:#fff;color:#1d2b24;font:800 13px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;box-shadow:0 1px 3px rgba(40,50,40,.12)}
  .gfxr button.on{background:#1e7a4c;color:#fff}
  /* ---------- relationships, together, search, UniAbuja X (59-social.js) ---------- */
  .chatv .cbtns{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .chatv .cbtns::-webkit-scrollbar{display:none}
  .chatv .cbtns button{flex:none;white-space:nowrap}
  .cbtns button.rel{background:#fbe3ec;color:#a3264f}
  .cbtns button .ic,.frb button .ic{width:14px;height:14px}
  .nmtag s{display:none;width:22px;height:22px;margin-left:2px;border-radius:50%;background:#ff4f8b;color:#fff;align-items:center;justify-content:center;text-decoration:none;flex:none;animation:ixp 1.4s ease-in-out infinite}
  .nmtag s .ic{width:14px;height:14px}
  .nmtag.ix s{display:flex}
  @keyframes ixp{0%,100%{transform:scale(1)}50%{transform:scale(1.15)}}
  #ixMenu{position:fixed;left:50%;bottom:calc(16px + env(safe-area-inset-bottom));transform:translate(-50%,140%);z-index:45;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px;
    max-width:min(560px,calc(100vw - 24px));padding:10px;border-radius:20px;background:rgba(255,255,255,.97);box-shadow:0 10px 30px rgba(20,10,30,.3);transition:transform .25s ease}
  #ixMenu.on{transform:translate(-50%,0)}
  #ixMenu b{width:100%;text-align:center;font:800 12px system-ui,sans-serif;color:#a3264f;text-transform:uppercase;letter-spacing:.05em}
  #ixMenu button{display:flex;align-items:center;gap:6px;height:42px;padding:0 14px;border:0;border-radius:14px;background:#fbe9f0;color:#3a1426;font:800 14px system-ui,sans-serif}
  #ixMenu button .ic{width:16px;height:16px;color:#d6336c}
  #ixMenu button.cx{width:42px;padding:0;justify-content:center;background:#eee}
  #askCard{position:fixed;left:50%;top:calc(12px + env(safe-area-inset-top));transform:translate(-50%,-160%);z-index:80;display:flex;align-items:center;gap:12px;
    max-width:calc(100vw - 24px);padding:10px 10px 12px 16px;border-radius:18px;background:#1d1420;color:#fff;box-shadow:0 10px 30px rgba(0,0,0,.35);transition:transform .25s ease;overflow:hidden}
  #askCard.on{transform:translate(-50%,0)}
  #askCard b{font:800 14px system-ui,sans-serif}
  #askCard span{display:flex;gap:6px;flex:none}
  #askCard button{height:38px;padding:0 14px;border:0;border-radius:12px;background:#3a2c40;color:#fff;font:800 13px system-ui,sans-serif}
  #askCard button.ok{background:#ff4f8b}
  #askCard i{position:absolute;left:0;bottom:0;height:3px;width:100%;background:#ff4f8b;transform-origin:0 50%}
  #askCard.on i{animation:askT linear forwards}
  @keyframes askT{from{transform:scaleX(1)}to{transform:scaleX(0)}}
  #holdBtn{position:fixed;left:50%;bottom:calc(18px + env(safe-area-inset-bottom));transform:translate(-50%,160%);z-index:30;display:flex;align-items:center;gap:8px;height:44px;padding:0 18px;border:0;border-radius:22px;
    background:#ff4f8b;color:#fff;font:800 14px system-ui,sans-serif;box-shadow:0 6px 18px rgba(160,30,80,.35);transition:transform .25s ease}
  #holdBtn.on{transform:translate(-50%,0)}
  #holdBtn .ic{width:18px;height:18px}
  .srch{display:flex;align-items:center;gap:8px;height:44px;margin:2px 0 8px;padding:0 12px;border:2px solid #e2dbc9;border-radius:14px;background:#fff}
  .srch .ic{width:18px;height:18px;color:#7a8791;flex:none}
  .srch input{flex:1;min-width:0;border:0;outline:none;background:none;font:600 16px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:#1d2b24}
  .relcard{display:flex;align-items:center;gap:12px;padding:12px;border-radius:16px;background:linear-gradient(135deg,#ffe3ee,#ffd0e1);margin-bottom:6px}
  .relcard>.ic{width:30px;height:30px;color:#e2366f;flex:none}
  .relcard div{flex:1;min-width:0}.relcard b{display:block;font-size:15px}.relcard small{color:#7a4a5a;font-weight:700;font-size:12px}
  .relv .frb{display:flex;gap:5px;flex:none}
  .xcomp{background:#fff;border-radius:16px;padding:10px;margin-bottom:10px;box-shadow:0 1px 3px rgba(40,50,40,.12)}
  .xcomp textarea{width:100%;box-sizing:border-box;border:0;outline:none;resize:none;font:600 15px/1.35 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:#1d2b24;background:none}
  .xcomp div{display:flex;align-items:center;justify-content:flex-end;gap:10px}
  .xcomp small{color:#8a8f94;font-weight:700}
  .xcomp .go{width:auto;margin:0;height:38px;padding:0 20px;background:#16181c}
  .xpost{display:flex;gap:10px;padding:10px 4px;border-bottom:1px solid #e8e1d0}
  .xpost .tile2{flex:none}
  .xb{flex:1;min-width:0}
  .xh{display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}
  .xh b{font-size:14px}.xh em{font-style:normal;font-size:11px;font-weight:800;color:#d6336c}.xh small{margin-left:auto;color:#8a8f94;font-size:11.5px;font-weight:700}
  .xb p{margin:3px 0 6px;font-size:14.5px;line-height:1.35;color:#1d2b24;white-space:pre-wrap;word-wrap:break-word}
  .xa{display:flex;gap:8px}
  .xa button{display:flex;align-items:center;gap:5px;height:30px;padding:0 10px;border:0;border-radius:15px;background:#efe9dc;color:#3a4a40;font:800 12px system-ui,sans-serif}
  .xa button .ic{width:15px;height:15px}
  .xa button.on{background:#ffe0eb;color:#d6336c}
  .xa button.armed{background:#c0392f;color:#fff}
  /* ---------- games (62-games.js) ---------- */
  body.ingame #stick,body.ingame #runBtn,body.ingame #act,body.ingame #todoBtn,body.ingame #todo,body.ingame #needsBtn,body.ingame #panel,body.ingame #phoneBtn,
  body.ingame #shopBtn,body.ingame #mini,body.ingame #emoBtn,body.ingame #emoPick,body.ingame #rideBtn,body.ingame #rideMenu,body.ingame #hint,body.ingame #tip,body.ingame #wp,body.ingame #place,body.ingame #top{display:none!important}
  #mgPad{position:fixed;inset:0;z-index:20;display:none;touch-action:none}
  #mgPad.on{display:block}
  #mgHud{position:fixed;left:50%;top:calc(10px + env(safe-area-inset-top));transform:translateX(-50%);z-index:25;display:none;align-items:center;gap:10px;flex-wrap:wrap;justify-content:center;
    padding:8px 16px;border-radius:18px;background:rgba(14,16,20,.86);color:#fff;font:800 15px system-ui,sans-serif;max-width:calc(100vw - 180px)}
  #mgHud.on{display:flex}
  #mgHud span{opacity:.6}
  #mgHud small{width:100%;text-align:center;font-size:11px;opacity:.7}
  #mgHud .pd{width:100%;display:flex;justify-content:center;gap:14px}
  #mgHud .pd span{display:flex;gap:4px;opacity:1}
  #mgHud .pd i{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.25)}
  #mgHud .pd i.g{background:#37e28a}#mgHud .pd i.m{background:#ff5a4a}
  #mgMsg{position:fixed;left:50%;top:38%;transform:translate(-50%,-50%) scale(.6);z-index:26;opacity:0;pointer-events:none;font:900 36px system-ui,sans-serif;text-shadow:0 4px 16px rgba(0,0,0,.6);white-space:nowrap;transition:transform .25s ease,opacity .25s ease}
  #mgMsg.on{opacity:1;transform:translate(-50%,-50%) scale(1)}
  #mgTip{position:fixed;left:50%;top:calc(74px + env(safe-area-inset-top));transform:translateX(-50%);z-index:25;display:none;padding:8px 16px;border-radius:16px;background:rgba(14,16,20,.8);color:#ffd27a;
    font:800 14px system-ui,sans-serif;pointer-events:none;max-width:calc(100vw - 40px);text-align:center}
  #mgTip.on{display:block}
  #mgQuit{position:fixed;right:calc(12px + env(safe-area-inset-right));top:calc(10px + env(safe-area-inset-top));z-index:27;display:none;align-items:center;gap:6px;height:40px;padding:0 14px;border:0;border-radius:20px;
    background:rgba(255,255,255,.92);color:#1d2b24;font:800 13px system-ui,sans-serif}
  #mgQuit.on{display:flex}#mgQuit .ic{width:16px;height:16px}
  #mgLobby{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%) scale(.9);z-index:60;display:none;flex-direction:column;gap:8px;width:min(380px,calc(100vw - 32px));max-height:calc(100vh - 40px);overflow:auto;
    padding:16px;border-radius:22px;background:#fff;box-shadow:0 20px 60px rgba(0,0,0,.4);opacity:0;transition:transform .2s ease,opacity .2s ease}
  #mgLobby.on{display:flex;opacity:1;transform:translate(-50%,-50%) scale(1)}
  #mgLobby b{font:900 20px system-ui,sans-serif;color:#1d2b24}
  #mgLobby small{font:600 13px system-ui,sans-serif;color:#5a6a60;margin-bottom:4px}
  #mgLobby i{font:700 12px system-ui,sans-serif;color:#8a6a3a;font-style:normal;text-transform:uppercase;letter-spacing:.04em;margin-top:4px}
  #mgLobby button{display:flex;align-items:center;gap:8px;height:46px;padding:0 14px;border:0;border-radius:14px;background:#f1ece0;color:#1d2b24;font:800 15px system-ui,sans-serif;text-align:left}
  #mgLobby button .ic{width:18px;height:18px}
  #mgLobby button.cpu{background:#1e7a4c;color:#fff}
  #mgLobby button.x{background:none;justify-content:center;color:#7a8791;height:38px}
  #poolBox{position:fixed;left:50%;top:calc(50% + 30px);transform:translate(-50%,-50%);z-index:24;display:none;border-radius:14px;overflow:hidden;box-shadow:0 14px 40px rgba(0,0,0,.5);touch-action:none}
  #poolBox.on{display:block}
  #poolBox canvas{width:100%;height:100%;display:block;touch-action:none}
  /* ---------- Ludo, Whot, events, camera (64-ludo.js, 65-whot.js, 63-fun.js) ---------- */
  #ludoBox{position:fixed;left:50%;top:calc(50% + 24px);transform:translate(-50%,-50%);z-index:24;display:none;align-items:center;gap:14px}
  #ludoBox.on{display:flex}
  #ludoBox canvas{border-radius:12px;box-shadow:0 14px 40px rgba(0,0,0,.45);touch-action:none;background:#fbf7ee}
  .lside{display:flex;flex-direction:column;align-items:center;gap:10px;width:150px;padding:14px;border-radius:18px;background:rgba(255,255,255,.95);box-shadow:0 8px 24px rgba(0,0,0,.3)}
  .lside b{font:900 16px system-ui,sans-serif;text-align:center}
  .lside .die{font-size:58px;line-height:1;height:60px;color:#1d2b24}
  .lside button{width:100%;height:46px;border:0;border-radius:14px;background:#d63a3a;color:#fff;font:900 17px system-ui,sans-serif}
  .lside button[disabled]{opacity:.35}
  .lside small{font:700 12px system-ui,sans-serif;color:#5a6a60;text-align:center;min-height:16px}
  #whotBox{position:fixed;inset:calc(64px + env(safe-area-inset-top)) calc(12px + env(safe-area-inset-right)) calc(10px + env(safe-area-inset-bottom)) calc(12px + env(safe-area-inset-left));z-index:24;display:none;
    flex-direction:column;align-items:center;justify-content:space-between;padding:10px;border-radius:22px;background:radial-gradient(circle at 50% 40%,#1f6b46,#0f3a26);box-shadow:0 14px 40px rgba(0,0,0,.45)}
  #whotBox.on{display:flex}
  .wopp{display:flex;align-items:center;gap:4px;min-height:40px}
  .wopp small{color:#cfe8d8;font:800 12px system-ui,sans-serif;margin-right:8px}
  .wback{width:26px;height:38px;border-radius:5px;background:repeating-linear-gradient(45deg,#7a1c2c 0 4px,#5a1220 4px 8px);border:2px solid #f6f1e6;margin-left:-10px}
  .wmid{display:flex;align-items:center;gap:22px}
  .wmkt{width:64px;height:92px;border:2px solid #f6f1e6;border-radius:10px;background:repeating-linear-gradient(45deg,#7a1c2c 0 5px,#5a1220 5px 10px);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font:800 11px system-ui,sans-serif}
  .wmkt b{font-size:18px}
  .wneed{color:#ffd27a;font:800 13px system-ui,sans-serif;min-width:80px}
  .wturn{color:#fff;font:800 13px system-ui,sans-serif}
  .whand{display:flex;gap:6px;overflow-x:auto;max-width:100%;padding:4px 4px 6px}
  .wcard{position:relative;flex:none;width:58px;height:86px;border-radius:9px;background:#f8f2e4;border:2px solid #e3d6b8;color:#7a1c2c;display:flex;align-items:center;justify-content:center;box-shadow:0 3px 8px rgba(0,0,0,.3)}
  #wTop .wcard{width:66px;height:96px}
  .wcard span{font-size:30px;font-weight:900}
  .wcard.ww span{font-size:15px;letter-spacing:.04em}
  .wcard i{position:absolute;left:5px;top:3px;font:900 13px system-ui,sans-serif;font-style:normal}
  .wcard i.b{left:auto;top:auto;right:5px;bottom:3px;transform:rotate(180deg)}
  .whand .wcard{opacity:.55}
  .whand .wcard[data-ok]{opacity:1;transform:translateY(-6px);border-color:#ffd27a}
  .wpick{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:none;flex-wrap:wrap;justify-content:center;gap:8px;width:250px;padding:14px;border-radius:18px;background:#fff;box-shadow:0 10px 30px rgba(0,0,0,.4)}
  .wpick.on{display:flex}
  .wpick b{width:100%;text-align:center;font:900 15px system-ui,sans-serif}
  .wpick button{width:56px;height:56px;border:0;border-radius:14px;background:#f8f2e4;color:#7a1c2c;font-size:28px;font-weight:900}
  .chip.ev{background:#fff1d6;color:#8a5a12}.chip.ev.on{background:#ffd27a;color:#3a2a08}
  #selfie{position:fixed;inset:0;z-index:23;display:none;pointer-events:none}
  #selfie.on{display:block}
  #selfie .sposes{position:absolute;left:50%;bottom:calc(98px + env(safe-area-inset-bottom));transform:translateX(-50%);display:flex;gap:6px;pointer-events:auto}
  #selfie .sposes button{height:36px;padding:0 14px;border:0;border-radius:18px;background:rgba(255,255,255,.85);font:800 13px system-ui,sans-serif;color:#1d2b24}
  #selfie .sposes button.on{background:#ffd27a}
  #selfie .shut{position:absolute;left:50%;bottom:calc(22px + env(safe-area-inset-bottom));transform:translateX(-50%);width:66px;height:66px;border-radius:50%;border:5px solid rgba(255,255,255,.6);background:#fff;pointer-events:auto;box-shadow:0 4px 14px rgba(0,0,0,.3)}
  #selfie .sflash{position:absolute;inset:0;background:#fff;opacity:0;pointer-events:none}
  #selfie .sflash.on{animation:sflash .5s ease-out}
  @keyframes sflash{0%{opacity:.9}100%{opacity:0}}
  #selfie .sprev{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:none;flex-direction:column;gap:10px;align-items:center;padding:12px;border-radius:18px;background:#fff;box-shadow:0 14px 40px rgba(0,0,0,.45);pointer-events:auto}
  #selfie .sprev.on{display:flex}
  #selfie .sprev img{max-width:min(520px,80vw);max-height:56vh;border-radius:10px}
  #selfie .sprev span{display:flex;gap:8px}
  #selfie .sprev button{height:40px;padding:0 16px;border:0;border-radius:14px;background:#1e7a4c;color:#fff;font:800 14px system-ui,sans-serif}
  #selfie .sprev button#sAgain{background:#e9e3d4;color:#1d2b24}
  .galg{display:grid;grid-template-columns:1fr 1fr;gap:8px}.galg img{width:100%;border-radius:10px}
  /* Relations: name and details on top, the buttons on their own line (fits a phone) */
  .relv .plrow{flex-wrap:wrap;row-gap:8px}
  .relv .plrow .rt{flex:1;min-width:0}
  .relv .plrow .rt small{display:block}
  .relv .plrow .frb{width:100%;display:flex;justify-content:flex-end;gap:6px}
  .relv .plrow .frb button{height:34px;padding:0 14px}
  .relcard{flex-wrap:wrap}.relcard .frb{width:100%;display:flex;justify-content:flex-end;gap:6px}
  /* the car radio button (67-music.js): bottom left while you ride */
  #radioBtn{position:fixed;left:calc(14px + env(safe-area-inset-left));bottom:calc(104px + env(safe-area-inset-bottom));z-index:13;display:none;align-items:center;gap:8px;
    height:46px;max-width:200px;padding:0 14px 0 10px;border:0;border-radius:23px;background:rgba(255,255,255,.95);color:#2a2431;box-shadow:0 3px 12px rgba(0,0,0,.22);
    font:800 12.5px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;text-align:left;touch-action:manipulation}
  #radioBtn.show{display:flex}
  #radioBtn:active{transform:scale(.95)}
  #radioBtn .ic{width:22px;height:22px;flex:none}
  #radioBtn span{display:flex;flex-direction:column;min-width:0}
  #radioBtn b{font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  #radioBtn small{font-size:10.5px;font-weight:700;opacity:.7;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  #radioBtn.on{background:linear-gradient(135deg,#7a2bd0,#c13fd6);color:#fff}
  body.phonemode #radioBtn,body.ingame #radioBtn,body.signing #radioBtn{display:none!important}
  #radioBtn.on.shared{background:linear-gradient(135deg,#1e7a4c,#2fa86a)}
  /* safety (69-safety.js): the report sheet, the Admin app, the suspended screen */
  #repBox{position:fixed;inset:0;z-index:60;display:none;align-items:center;justify-content:center;background:rgba(10,12,14,.55);padding:16px}
  #repBox.on{display:flex}
  #repBox .rpc{width:min(420px,100%);max-height:calc(100% - 8px);overflow:auto;background:#fff;border-radius:22px;padding:16px 16px 14px;box-shadow:0 12px 40px rgba(0,0,0,.35);font:14px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:#1f2a23}
  #repBox h3{margin:0 0 4px;font-size:17px;display:flex;align-items:center;gap:7px}
  #repBox h3 .ic{width:20px;height:20px;color:#c0392f}
  #repBox p{margin:0 0 10px;color:#5b675f;font-size:12.5px}
  .rpw{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
  .rpw button{border:1.5px solid #dfe5e0;background:#f6f8f6;border-radius:99px;padding:7px 11px;font:700 12.5px system-ui,sans-serif;color:#2c3a31}
  .rpw button.on{background:#1e7a4c;border-color:#1e7a4c;color:#fff}
  #repBox textarea{width:100%;box-sizing:border-box;border:1.5px solid #dfe5e0;border-radius:14px;padding:8px 10px;font:14px system-ui,sans-serif;resize:none;margin-bottom:8px}
  .rpb{display:flex!important;flex-direction:row!important;align-items:center;justify-content:flex-start;gap:8px;font:700 12.5px system-ui,sans-serif;color:#2c3a31;margin:2px 0 10px;text-align:left}
  .rpb input{width:18px!important;height:18px;margin:0!important;flex:none;accent-color:#1e7a4c}
  .rpa{display:flex;justify-content:flex-end;gap:8px}
  .rpa button{border:0;border-radius:14px;height:40px;padding:0 16px;font:800 13px system-ui,sans-serif;background:#eef1ee;color:#2c3a31}
  .rpa button.go{background:#c0392f;color:#fff}
  .rpa button[disabled]{opacity:.45}
  .xa .xrep{margin-left:auto;padding:0 8px;color:#8a968e}
  .xa .xrep .ic{width:15px;height:15px}
  .xa .xrep+.xrep{margin-left:4px;color:#c0392f;font-weight:800}
  .admv .tabs{display:flex;gap:6px;margin:4px 0 10px}
  .admv .tabs button{flex:1;border:0;border-radius:12px;height:36px;background:#eef1ee;font:800 12.5px system-ui,sans-serif;color:#2c3a31}
  .admv .tabs button.on{background:#1f2a23;color:#fff}
  .admr{background:#fff;border-radius:18px;padding:11px 12px;margin-bottom:9px;box-shadow:0 1px 3px rgba(40,50,40,.1);font-size:12.5px;color:#2c3a31}
  .adh{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:6px}
  .adh b{font-size:14.5px}
  .adh small{color:#c0392f;font-weight:800}
  .adi{border-top:1px solid #eef1ee;padding:7px 0}
  .adi em{font-style:normal;font-weight:800;color:#1f2a23}
  .adi q{display:block;margin:6px 0 2px;padding:7px 9px;background:#f6f8f6;border-radius:10px;quotes:none;color:#1f2a23}
  .adi p,.admr>p{margin:5px 0 0;color:#5b675f}
  .ada{display:flex;flex-wrap:wrap;gap:6px;margin-top:7px}
  .ada button{border:0;border-radius:11px;height:32px;padding:0 11px;background:#eef1ee;font:800 12px system-ui,sans-serif;color:#2c3a31}
  .ada.ban{border-top:1px solid #eef1ee;padding-top:8px}
  .ada.ban button{background:#fbe4e1;color:#a2291f}
  .ada.ban button.bad{background:#c0392f;color:#fff}
  .ada button.armed{background:#1f2a23!important;color:#fff!important}
  #banScr{position:fixed;inset:0;z-index:90;display:none;align-items:center;justify-content:center;background:#141917;padding:16px}
  #banScr.on{display:flex}
  #banScr .bnc{max-width:380px;text-align:center;color:#eef3ef;font:15px system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
  #banScr .ic{width:54px;height:54px;color:#e0574c}
  #banScr h2{margin:10px 0 8px;font-size:22px}
  #banScr p{margin:0 0 8px;color:#c9d3cc}
  #banScr p.why{color:#fff;font-weight:700}
  #banScr p.sm{font-size:12.5px;color:#8fa096}
  #banScr button{margin-top:10px;border:0;border-radius:16px;height:44px;padding:0 22px;background:#fff;color:#141917;font:800 14px system-ui,sans-serif}