@import url('https://fonts.googleapis.com/css2?family=Sora:wght@400;500;600;700;800&family=Manrope:wght@400;500;600;700&display=swap');
  :root{
    --bg:#ffffff;--ink:#15130f;--ink-soft:#6b6557;--ink-faint:#a8a294;
    --line:#ece8e0;--line-soft:#f4f1ea;
    --accent:#d35400;--accent-deep:#a8410b;--accent-wash:#fdf1e7;
    --done:#2f8f5b;--done-wash:#eaf6ef;--danger:#d83a34;
    --field:#f7f5f0;--radius-sm:14px;
    --shadow-card:0 1px 2px rgba(21,19,15,.04),0 6px 18px rgba(21,19,15,.05);
    --shadow-float:0 8px 16px rgba(168,65,11,.18),0 16px 40px rgba(168,65,11,.22);
    font-family:'Manrope',-apple-system,sans-serif;
  }
  *{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
  [hidden]{display:none!important;}
  html,body{height:100%;}
  body{background:var(--bg);color:var(--ink);overflow:hidden;position:fixed;width:100%;height:100%;}
  .login-view{
    position:fixed;
    inset:0;
    z-index:300;
    display:grid;
    place-items:center;
    padding:24px;
    background:var(--bg);
  }
  .login-card{
    width:100%;
    max-width:340px;
    border:1px solid var(--line);
    border-radius:18px;
    background:#fff;
    box-shadow:var(--shadow-card);
    padding:24px;
  }
  .login-brand{
    font-family:'Sora';
    font-weight:800;
    font-size:28px;
    margin-bottom:22px;
  }
  .login-field{
    display:block;
    margin-bottom:14px;
  }
  .login-field span{
    display:block;
    font-family:'Sora';
    font-weight:700;
    font-size:11px;
    letter-spacing:.08em;
    text-transform:uppercase;
    color:var(--ink-faint);
    margin-bottom:7px;
  }
  .login-field select,
  .login-field input{
    width:100%;
    border:1px solid var(--line);
    border-radius:12px;
    background:#fff;
    color:var(--ink);
    font-family:'Manrope';
    font-size:16px;
    padding:13px 12px;
  }
  .login-button{
    width:100%;
    border:0;
    border-radius:14px;
    background:linear-gradient(145deg,var(--accent),var(--accent-deep));
    color:#fff;
    cursor:pointer;
    font-family:'Sora';
    font-weight:700;
    font-size:15px;
    padding:15px;
    margin-top:4px;
  }
  .login-button:disabled{
    opacity:.65;
    cursor:wait;
  }
  .login-error{
    min-height:20px;
    margin-top:12px;
    color:var(--danger);
    font-size:13px;
    line-height:1.4;
  }
  .phone-root{position:fixed;inset:0;overflow:hidden;background:var(--bg);}
  .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
  .navbar{
    position:absolute;top:0;left:0;right:0;z-index:50;
    height:calc(env(safe-area-inset-top,0px) + 58px);
    padding:calc(env(safe-area-inset-top,0px) + 8px) 14px 8px;
    background:rgba(255,255,255,.72);
    backdrop-filter:blur(22px) saturate(185%);
    -webkit-backdrop-filter:blur(22px) saturate(185%);
    border-bottom:1px solid rgba(236,232,224,.62);
  }
  .tabs{
    height:42px;
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:7px;
    align-items:center;
  }
  .tab,.nav-settings{
    min-width:0;width:100%;height:42px;
    border:1px solid transparent;
    border-radius:14px;
    background:transparent;
    display:grid;
    place-items:center;
    cursor:pointer;
    color:var(--ink-faint);
    transition:transform .18s ease, background .18s ease, border-color .18s ease, color .18s ease;
    touch-action:manipulation;
  }
  .tab svg,.nav-settings svg{
    width:21px;
    height:21px;
    stroke:currentColor;
    stroke-width:2.15;
    stroke-linecap:round;
    stroke-linejoin:round;
  }
  .tab.on{
    color:var(--accent-deep);
    background:rgba(253,241,231,.86);
    border-color:#f6e0cf;
  }
  .tab:active,.nav-settings:active{transform:scale(.92);background:var(--field);}
  .sync-strip{
    position:absolute;
    top:calc(env(safe-area-inset-top,0px) + 58px);
    left:0;
    right:0;
    z-index:49;
    min-height:24px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    padding:4px 14px;
    border-bottom:1px solid rgba(236,232,224,.58);
    background:rgba(255,255,255,.7);
    backdrop-filter:blur(18px) saturate(165%);
    -webkit-backdrop-filter:blur(18px) saturate(165%);
    font-family:'Sora';
    font-size:10.5px;
    font-weight:700;
    letter-spacing:.04em;
    text-transform:uppercase;
    color:var(--ink-faint);
  }
  .sync-dot{
    width:7px;
    height:7px;
    border-radius:50%;
    background:var(--done);
    flex-shrink:0;
  }
  .sync-dot.refreshing{background:#c89a2b;animation:pulse 1s ease-in-out infinite;}
  .sync-dot.saving{background:var(--accent);animation:pulse 1s ease-in-out infinite;}
  .sync-dot.error{background:var(--danger);}
  .sync-dot.offline{background:var(--ink-faint);}
  @keyframes pulse{50%{opacity:.45;transform:scale(.84);}}
  .screen{position:absolute;inset:0;overflow-y:auto;-webkit-overflow-scrolling:touch;padding-bottom:calc(120px + env(safe-area-inset-bottom,0px));padding-top:calc(env(safe-area-inset-top,0px) + 98px);}
  @media (max-width:390px){
    .navbar{height:calc(env(safe-area-inset-top,0px) + 54px);padding:calc(env(safe-area-inset-top,0px) + 7px) 12px 7px;}
    .sync-strip{top:calc(env(safe-area-inset-top,0px) + 54px);}
    .tabs{height:40px;gap:6px;}
    .tab,.nav-settings{height:40px;border-radius:13px;}
    .tab svg,.nav-settings svg{width:20px;height:20px;}
    .screen{padding-top:calc(env(safe-area-inset-top,0px) + 92px);}
  }
  .screen::-webkit-scrollbar{display:none;}
  .page{display:none;}
  .page.on{display:block;animation:fade .35s ease;}
  @keyframes fade{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:none;}}
  .sec-label{font-family:'Sora';font-weight:700;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint);padding:0 22px;margin-bottom:9px;display:flex;align-items:center;gap:8px;}
  .sec-label .count{background:var(--field);color:var(--ink-soft);border-radius:999px;padding:2px 9px;font-size:10px;}
  .sec-label.done-label{color:var(--done);}
  .sec-label.done-label .count{background:var(--done-wash);color:var(--done);}
  .list{padding:0 16px;display:flex;flex-direction:column;gap:7px;}
  .swipe{position:relative;border-radius:var(--radius-sm);overflow:hidden;}
  .swipe-actions{position:absolute;top:0;right:0;height:100%;display:flex;}
  .swipe-actions button{width:64px;border:0;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-family:'Sora';font-weight:600;font-size:10px;color:#fff;}
  .swipe-actions svg{width:18px;height:18px;stroke:#fff;stroke-width:2.2;}
  .sa-edit{background:var(--accent);}
  .sa-del{background:var(--danger);}
  .swipe-face{position:relative;z-index:2;background:#fff;transition:transform .28s cubic-bezier(.32,.72,0,1);}
  .swipe.open .swipe-face{transform:translateX(-128px);}
  .item{border:1px solid var(--line);border-radius:var(--radius-sm);padding:11px 13px;display:flex;align-items:flex-start;gap:12px;box-shadow:var(--shadow-card);background:#fff;}
  .check{width:23px;height:23px;border-radius:7px;border:2px solid var(--line);flex-shrink:0;cursor:pointer;display:grid;place-items:center;margin-top:1px;transition:.2s;}
  .check svg{width:12px;height:12px;stroke:#fff;stroke-width:3.5;opacity:0;transition:.2s;}
  .check:active{transform:scale(.85);}
  .item.checked .check{background:var(--done);border-color:var(--done);}
  .item.checked .check svg{opacity:1;}
  .item.checked{opacity:.45;}
  .item.checked .it-name{text-decoration:line-through;}
  .it-body{flex:1;min-width:0;display:flex;align-items:flex-start;justify-content:space-between;gap:10px;}
  .it-main{flex:1;min-width:0;}
  .it-name{font-weight:600;font-size:14.5px;line-height:1.3;color:var(--ink);word-break:break-word;}
  .it-sub{font-size:12px;color:var(--ink-faint);margin-top:2px;font-style:italic;}
  .it-qty{background:var(--accent-wash);color:var(--accent-deep);font-weight:700;border-radius:7px;padding:3px 10px;font-size:12.5px;white-space:nowrap;flex-shrink:0;margin-top:1px;}
  .it-meta,.it-meta-row{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin-top:7px;}
  .reminder-pill,.remind-pill{display:inline-flex;align-items:center;border:1px solid #c79022;background:#15130f;color:#fff7dd;border-radius:999px;padding:4px 9px;font-family:'Sora';font-weight:800;font-size:9.5px;letter-spacing:.07em;text-transform:uppercase;box-shadow:0 5px 14px rgba(21,19,15,.14);}
  .calendar-btn,.mini-cal-btn{border:1px solid var(--line);background:#fff;color:var(--accent-deep);border-radius:999px;padding:4px 9px;font-family:'Sora';font-weight:700;font-size:10.5px;cursor:pointer;white-space:nowrap;touch-action:manipulation;}
  .calendar-btn:active,.mini-cal-btn:active{background:var(--accent-wash);transform:scale(.97);}
  .done-group{padding:0 16px;}
  .done-date{font-family:'Sora';font-weight:700;font-size:12px;color:var(--done);padding:13px 6px 7px;display:flex;align-items:center;gap:8px;}
  .done-date::after{content:"";flex:1;height:1px;background:var(--done-wash);}
  .done-item{display:flex;gap:11px;align-items:center;padding:7px 8px;}
  .done-item .dot{width:6px;height:6px;border-radius:50%;background:var(--done);opacity:.5;flex-shrink:0;}
  .done-item .dn{font-size:13.5px;color:var(--ink-soft);flex:1;}
  .done-item .dq{font-size:12px;color:var(--ink-faint);}
  .empty{text-align:center;padding:46px 30px;color:var(--ink-faint);}
  .empty svg{width:42px;height:42px;stroke:var(--line);stroke-width:1.5;margin-bottom:13px;}
  .empty p{font-size:13.5px;line-height:1.5;}
  .tunti-summary{padding:0 16px;margin-bottom:18px;display:flex;gap:10px;}
  .sum-card{flex:1;background:linear-gradient(160deg,#fff,var(--field));border:1px solid var(--line);border-radius:16px;padding:15px 16px;box-shadow:var(--shadow-card);}
  .sum-card .lbl{font-family:'Sora';font-weight:700;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint);margin-bottom:6px;}
  .sum-card .val{font-family:'Sora';font-weight:800;font-size:22px;letter-spacing:-.02em;color:var(--ink);}
  .sum-card.accent .val{color:var(--accent-deep);}
  .tunti-page-calendar{padding:0 16px;margin:0 0 18px;}
  .tunti-calendar-card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:13px;box-shadow:var(--shadow-card);}
  .loading{position:absolute;inset:0;z-index:70;display:none;align-items:center;justify-content:center;background:rgba(255,255,255,.6);backdrop-filter:blur(2px);}
  .loading.on{display:flex;}
  .spinner{width:34px;height:34px;border:3px solid var(--line);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite;}
  @keyframes spin{to{transform:rotate(360deg);}}
  .fab{position:absolute;left:20px;bottom:calc(24px + env(safe-area-inset-bottom,0px));z-index:60;width:60px;height:60px;border-radius:20px;border:0;cursor:pointer;background:linear-gradient(145deg,var(--accent),var(--accent-deep));box-shadow:var(--shadow-float);display:grid;place-items:center;transition:.28s cubic-bezier(.34,1.56,.64,1);}
  .fab svg{width:27px;height:27px;stroke:#fff;stroke-width:2.6;}
  .fab:active{transform:scale(.9);}
  .fab.open{transform:rotate(135deg);}
  .fab-menu{position:absolute;left:20px;bottom:calc(96px + env(safe-area-inset-bottom,0px));z-index:60;display:flex;flex-direction:column;gap:10px;align-items:flex-start;opacity:0;pointer-events:none;transform:translateY(12px) scale(.96);transition:.28s cubic-bezier(.34,1.56,.64,1);}
  .fab-menu.open{opacity:1;pointer-events:auto;transform:none;}
  .fab-act{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--line);padding:11px 18px 11px 13px;border-radius:15px;cursor:pointer;box-shadow:var(--shadow-card);font-family:'Sora';font-weight:600;font-size:14px;color:var(--ink);transition:.2s;}
  .fab-act:active{transform:scale(.95);}
  .fab-act .ic{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;flex-shrink:0;}
  .fab-act .ic svg{width:18px;height:18px;stroke:#fff;stroke-width:2.4;}
  .fab-act:nth-child(1) .ic{background:var(--accent);}
  .fab-act:nth-child(2) .ic{background:#c89a2b;}
  .fab-act:nth-child(3) .ic{background:#3a7bd5;}
  .scrim{position:absolute;inset:0;z-index:55;background:rgba(21,19,15,.18);backdrop-filter:blur(2px);opacity:0;pointer-events:none;transition:.3s;}
  .scrim.on{opacity:1;pointer-events:auto;}
  .sheet{position:absolute;inset:0;z-index:80;background:var(--bg);transform:translateY(100%);transition:.4s cubic-bezier(.32,.72,0,1);display:flex;flex-direction:column;}
  .sheet.on{transform:none;}
  .sheet-head{padding:calc(env(safe-area-inset-top,0px) + 14px) 16px 14px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);background:rgba(255,255,255,.85);backdrop-filter:blur(20px);position:relative;z-index:3;}
  .sheet-head h2{font-family:'Sora';font-weight:700;font-size:17px;}
  .btn-cancel{border:0;background:transparent;color:var(--accent-deep);font-family:'Manrope';font-weight:700;font-size:15px;cursor:pointer;padding:6px 2px;}
  .btn-cancel:active{opacity:.5;}
  .btn-head-save{border:0;background:transparent;color:var(--accent-deep);font-family:'Manrope';font-weight:800;font-size:15px;cursor:pointer;padding:6px 2px;min-width:54px;text-align:right;-webkit-user-select:none;user-select:none;touch-action:manipulation;}
  .btn-head-save:active{opacity:.5;}
  .btn-head-save.busy,.btn-head-save:disabled{opacity:.62;pointer-events:none;cursor:wait;}
  .sheet-body{flex:1;overflow-y:auto;padding:16px 14px;}
  .sheet-body::-webkit-scrollbar{display:none;}
  .row-card{background:var(--field);border-radius:13px;padding:11px;margin-bottom:9px;position:relative;animation:fade .25s ease;}
  .row-card .row-num{position:absolute;top:-7px;left:11px;background:var(--accent);color:#fff;font-family:'Sora';font-weight:700;font-size:10px;width:20px;height:20px;border-radius:7px;display:grid;place-items:center;}
  .row-x{position:absolute;top:-7px;right:11px;width:20px;height:20px;border-radius:7px;border:0;background:var(--danger);cursor:pointer;display:grid;place-items:center;}
  .row-x svg{width:11px;height:11px;stroke:#fff;stroke-width:3;}
  .row-x:active{transform:scale(.85);}
  .ostos-inline{display:flex;gap:8px;align-items:stretch;padding-top:4px;}
  .ostos-inline .ac-wrap{flex:1;}
  .ostos-inline input{width:100%;border:1px solid var(--line);background:#fff;border-radius:10px;padding:12px 13px;font-family:'Manrope';font-weight:500;font-size:15px;color:var(--ink);transition:.2s;}
  .ostos-inline .qty{width:84px;flex-shrink:0;text-align:center;}
  .ostos-inline input:focus{outline:0;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-wash);}
  .ostos-inline input::placeholder{color:var(--ink-faint);font-weight:400;}
  .fld{margin-top:9px;}
  .fld input,.fld textarea{width:100%;border:1px solid var(--line);background:#fff;border-radius:10px;padding:12px 13px;font-family:'Manrope';font-weight:500;font-size:15px;color:var(--ink);transition:.2s;resize:none;}
  .fld input:focus,.fld textarea:focus{outline:0;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-wash);}
  .fld input::placeholder,.fld textarea::placeholder{color:var(--ink-faint);font-weight:400;}
  .fld.row-top{display:flex;gap:8px;margin-top:4px;}
  .fld.row-top .date-display{flex:1;}
  .fld.row-top .hrs{width:90px;flex-shrink:0;}
  .remind-toggle{margin-top:9px;border:1px solid var(--line);background:#fff;border-radius:11px;padding:11px 12px;display:flex;align-items:center;gap:10px;cursor:pointer;font-family:'Sora';font-weight:700;font-size:13px;color:var(--ink);}
  .remind-toggle input{width:18px;height:18px;accent-color:var(--accent);flex-shrink:0;}
  .remind-toggle span{min-width:0;overflow-wrap:anywhere;}
  .ac-wrap{position:relative;}
  .ac-list{position:absolute;left:0;right:0;top:calc(100% + 5px);z-index:9;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 30px rgba(21,19,15,.14);overflow:hidden;max-height:0;opacity:0;transition:.2s;}
  .ac-list.on{max-height:210px;opacity:1;overflow-y:auto;}
  .ac-item{padding:11px 14px;font-size:14px;font-weight:500;cursor:pointer;border-bottom:1px solid var(--line-soft);display:flex;align-items:center;gap:10px;}
  .ac-item:last-child{border-bottom:0;}
  .ac-item:active{background:var(--accent-wash);}
  .ac-item .hl{color:var(--accent-deep);font-weight:700;}
  .ac-item svg{width:14px;height:14px;stroke:var(--ink-faint);flex-shrink:0;}
  .add-row-btn{width:100%;border:1.5px dashed var(--line);background:transparent;border-radius:12px;padding:13px;font-family:'Sora';font-weight:600;font-size:13.5px;color:var(--accent-deep);cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;margin-top:2px;transition:.2s;}
  .add-row-btn svg{width:16px;height:16px;stroke:var(--accent);stroke-width:2.6;}
  .add-row-btn:active{background:var(--accent-wash);}
  .inline-existing{margin-top:22px;}
  .inline-existing .eh{font-family:'Sora';font-weight:700;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint);padding:0 4px;margin-bottom:9px;display:flex;align-items:center;gap:7px;}
  .inline-existing .eh::after{content:"";flex:1;height:1px;background:var(--line);}
  .date-display{display:flex;align-items:center;gap:8px;cursor:pointer;border:1px solid var(--line);background:#fff;border-radius:10px;padding:11px 13px;}
  .date-display svg{width:16px;height:16px;stroke:var(--accent);flex-shrink:0;}
  .date-display input{border:0;background:transparent;padding:0;font-weight:600;font-size:15px;cursor:pointer;width:100%;color:var(--ink);}
  .date-display.empty input{color:var(--ink-faint);font-weight:400;}
  .cal{background:#fff;border:1px solid var(--line);border-radius:13px;padding:13px;margin-top:7px;box-shadow:var(--shadow-card);display:none;}
  .cal.on{display:block;animation:fade .25s;}
  .cal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:11px;}
  .cal-head b{font-family:'Sora';font-weight:700;font-size:13.5px;}
  .cal-nav{width:30px;height:30px;border-radius:9px;border:1px solid var(--line);background:#fff;cursor:pointer;display:grid;place-items:center;}
  .cal-nav svg{width:14px;height:14px;stroke:var(--ink-soft);stroke-width:2.4;}
  .cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;}
  .cal-dow{text-align:center;font-family:'Sora';font-weight:700;font-size:10px;color:var(--ink-faint);padding:4px 0;}
  .cal-day{aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;border-radius:9px;font-size:13px;font-weight:600;cursor:pointer;color:var(--ink);transition:.15s;line-height:1;}
  .cal-day:active{background:var(--field);}
  .cal-day.muted{opacity:.35;}
  .cal-day.today{box-shadow:inset 0 0 0 1.5px var(--accent);}
  .cal-day.has-hours{box-shadow:inset 0 0 0 1.5px var(--done);color:var(--done);}
  .cal-day.has-hours.today{box-shadow:inset 0 0 0 1.5px var(--accent),inset 0 0 0 4px var(--done-wash);}
  .cal-day.sel{background:var(--accent);color:#fff;}
  .cal-day-num{display:block;}
  .cal-hours-badge{display:block;max-width:100%;border-radius:999px;background:var(--done-wash);color:var(--done);padding:2px 4px;font-family:'Sora';font-size:8.5px;font-weight:800;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .page-cal-day{cursor:default;}
  .page-cal-day:active{background:transparent;}
  .sheet-foot{padding:13px 16px calc(13px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--line);display:flex;gap:11px;background:rgba(255,255,255,.92);backdrop-filter:blur(20px);}
  .btn{flex:1;border:0;border-radius:14px;padding:16px;font-family:'Sora';font-weight:700;font-size:15px;cursor:pointer;transition:.2s;}
  .btn-save{background:linear-gradient(145deg,var(--accent),var(--accent-deep));color:#fff;box-shadow:0 6px 16px rgba(168,65,11,.28);}
  .btn-save:active{transform:scale(.98);}
  .btn-save.busy,.btn-save:disabled{opacity:.62;pointer-events:none;cursor:wait;filter:saturate(.85);}
  .confirm{position:absolute;inset:0;z-index:120;display:none;align-items:center;justify-content:center;padding:30px;background:rgba(21,19,15,.4);backdrop-filter:blur(3px);}
  .confirm.on{display:flex;animation:fade .2s;}
  .confirm-box{background:#fff;border-radius:20px;padding:24px;width:100%;max-width:300px;text-align:center;box-shadow:0 20px 60px rgba(0,0,0,.3);}
  .confirm-box .ci{width:52px;height:52px;border-radius:50%;background:#fdeceb;display:grid;place-items:center;margin:0 auto 14px;}
  .confirm-box .ci svg{width:25px;height:25px;stroke:var(--danger);stroke-width:2;}
  .confirm-box h3{font-family:'Sora';font-weight:700;font-size:17px;margin-bottom:6px;}
  .confirm-box p{font-size:13.5px;color:var(--ink-soft);line-height:1.5;margin-bottom:20px;}
  .confirm-btns{display:flex;gap:10px;}
  .confirm-btns button{flex:1;border:0;border-radius:12px;padding:14px;font-family:'Sora';font-weight:700;font-size:14px;cursor:pointer;}
  .cb-cancel{background:var(--field);color:var(--ink-soft);}
  .cb-del{background:var(--danger);color:#fff;}
  .reminder-modal{position:absolute;inset:0;z-index:130;display:none;align-items:center;justify-content:center;padding:24px;background:rgba(21,19,15,.38);backdrop-filter:blur(4px);}
  .reminder-modal.on{display:flex;animation:fade .2s;}
  .reminder-box{width:100%;max-width:340px;background:#fff;border-radius:18px;padding:22px;box-shadow:0 22px 70px rgba(0,0,0,.32);}
  .reminder-icon{width:48px;height:48px;border-radius:16px;background:#fff7dd;display:grid;place-items:center;margin-bottom:12px;}
  .reminder-icon svg{width:24px;height:24px;stroke:#8a5b00;stroke-width:2.2;}
  .reminder-box h3{font-family:'Sora';font-size:18px;margin-bottom:12px;}
  .reminder-list{display:flex;flex-direction:column;gap:8px;max-height:46vh;overflow-y:auto;margin-bottom:16px;}
  .reminder-modal-item{border:1px solid var(--line);border-radius:13px;padding:11px;display:flex;align-items:flex-start;gap:10px;}
  .reminder-modal-check{width:25px;height:25px;border:2px solid var(--done);border-radius:8px;background:#fff;display:grid;place-items:center;cursor:pointer;flex-shrink:0;}
  .reminder-modal-check svg{width:14px;height:14px;stroke:var(--done);stroke-width:3;}
  .reminder-modal-text{min-width:0;flex:1;}
  .reminder-modal-text b{display:block;font-family:'Sora';font-size:13.5px;line-height:1.25;color:var(--ink);overflow-wrap:anywhere;}
  .reminder-modal-text span{display:block;font-size:12px;color:#8a5b00;font-weight:700;margin-top:3px;}
  .reminder-modal-text p{font-size:12.5px;color:var(--ink-soft);line-height:1.35;margin-top:4px;overflow-wrap:anywhere;}
  .calendar-btn.modal-cal,.mini-cal-btn.modal-cal{align-self:center;flex-shrink:0;padding:5px 8px;font-size:10px;}
  .reminder-actions{display:flex;gap:10px;}
  .reminder-actions button{flex:1;border:0;border-radius:12px;padding:13px;font-family:'Sora';font-weight:800;font-size:13px;cursor:pointer;}
  .reminder-later{background:var(--field);color:var(--ink-soft);}
  .reminder-ack-all{background:linear-gradient(145deg,var(--accent),var(--accent-deep));color:#fff;}
  .set-title{font-family:'Sora';font-weight:700;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-faint);margin:20px 4px 10px;}
  .proj-card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px;display:flex;align-items:center;gap:13px;cursor:pointer;margin-bottom:8px;box-shadow:var(--shadow-card);transition:.2s;}
  .proj-card:active{transform:scale(.99);background:var(--field);}
  .proj-card.active{border-color:var(--accent);background:var(--accent-wash);}
  .proj-ic{width:42px;height:42px;border-radius:12px;background:var(--field);display:grid;place-items:center;flex-shrink:0;}
  .proj-card.active .proj-ic{background:#fff;}
  .proj-ic svg{width:21px;height:21px;stroke:var(--accent);stroke-width:2;}
  .proj-info{flex:1;}
  .proj-info b{display:block;font-family:'Sora';font-weight:700;font-size:15px;}
  .proj-info span{font-size:12px;color:var(--ink-faint);}
  .proj-check{width:22px;height:22px;border-radius:50%;border:2px solid var(--line);display:grid;place-items:center;}
  .proj-card.active .proj-check{background:var(--accent);border-color:var(--accent);}
  .proj-check svg{width:12px;height:12px;stroke:#fff;stroke-width:3;opacity:0;}
  .proj-card.active .proj-check svg{opacity:1;}
  .toast{position:absolute;bottom:calc(30px + env(safe-area-inset-bottom,0px));left:50%;transform:translateX(-50%) translateY(20px);background:var(--ink);color:#fff;padding:13px 22px;border-radius:13px;font-family:'Sora';font-weight:600;font-size:14px;z-index:200;opacity:0;transition:.3s;display:flex;align-items:center;gap:9px;white-space:nowrap;box-shadow:0 10px 30px rgba(0,0,0,.3);}
  .toast svg{width:17px;height:17px;stroke:var(--done);stroke-width:3;}
  .toast.on{opacity:1;transform:translateX(-50%);}
  .toast.err svg{stroke:var(--danger);}


  /* =========================================================
     I P H O N E  M I N I  /  K A P E A T  R U U D U T
     Korjaus ilman JS-laitehaistelua: mikään runko/kortti ei saa ylittää viewportia.
     ========================================================= */
  html{
    width:100%;
    max-width:100%;
    overflow:hidden;
    -webkit-text-size-adjust:100%;
    text-size-adjust:100%;
  }
  body{
    width:100%;
    max-width:100%;
    min-width:0;
    overflow:hidden;
    overscroll-behavior:none;
  }
  .phone-root,
  .navbar,
  .tabs,
  .screen,
  .page,
  .list,
  .sheet,
  .sheet-body,
  .row-card,
  .item,
  .tunti-summary,
  .tunti-page-calendar,
  .sum-card,
  .confirm-box,
  .reminder-box,
  .proj-card{
    max-width:100%;
    min-width:0;
  }
  .screen,
  .sheet-body{
    overflow-x:hidden;
  }
  .navbar{
    left:0;
    right:0;
    width:100%;
    max-width:100%;
    padding-left:clamp(8px,3.2vw,14px);
    padding-right:clamp(8px,3.2vw,14px);
  }
  .tabs{
    width:100%;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:clamp(4px,1.6vw,7px);
  }
  .tab,.nav-settings{
    min-width:0;
    width:100%;
    max-width:100%;
  }
  .list,
  .done-group,
  .tunti-summary,
  .tunti-page-calendar{
    padding-left:clamp(10px,3.6vw,16px);
    padding-right:clamp(10px,3.6vw,16px);
  }
  .sec-label{
    padding-left:clamp(14px,4.8vw,22px);
    padding-right:clamp(14px,4.8vw,22px);
  }
  .it-body,
  .it-main,
  .proj-info,
  .ostos-inline .ac-wrap,
  .fld.row-top .date-display{
    min-width:0;
  }
  .it-name,
  .it-sub,
  .proj-info b,
  .proj-info span{
    overflow-wrap:anywhere;
  }
  .it-qty{
    max-width:42%;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .sheet-head{
    padding-left:clamp(10px,3.6vw,16px);
    padding-right:clamp(10px,3.6vw,16px);
    gap:8px;
  }
  .sheet-head h2{
    min-width:0;
    text-align:center;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .sheet-body{
    padding-left:clamp(10px,3.6vw,14px);
    padding-right:clamp(10px,3.6vw,14px);
  }
  .row-card{
    width:100%;
  }
  .ostos-inline,
  .fld.row-top{
    width:100%;
    min-width:0;
  }
  .ostos-inline .qty{
    width:clamp(68px,22vw,84px);
  }
  .fld.row-top .hrs{
    width:clamp(72px,24vw,90px);
  }
  input,textarea,button{
    max-width:100%;
  }
  input,textarea,
  .date-display input,
  .ostos-inline input,
  .fld input,
  .fld textarea{
    font-size:16px;
  }

  @media (max-width:390px){
    .navbar{
      height:calc(env(safe-area-inset-top,0px) + 52px);
      padding-top:calc(env(safe-area-inset-top,0px) + 6px);
      padding-bottom:6px;
    }
    .sync-strip{top:calc(env(safe-area-inset-top,0px) + 52px);}
    .tabs{height:40px;}
    .tab,.nav-settings{height:40px;border-radius:12px;}
    .tab svg,.nav-settings svg{width:19px;height:19px;}
    .screen{padding-top:calc(env(safe-area-inset-top,0px) + 88px);}
    .item{padding:10px 11px;gap:10px;}
    .it-name{font-size:14px;}
    .sum-card{padding:13px 12px;}
    .sum-card .val{font-size:20px;}
    .sheet-head h2{font-size:16px;}
    .btn-cancel,.btn-head-save{font-size:14px;}
  }

  @media (max-width:360px){
    .navbar{padding-left:8px;padding-right:8px;}
    .tabs{gap:4px;}
    .tab,.nav-settings{height:38px;border-radius:11px;}
    .tab svg,.nav-settings svg{width:18px;height:18px;}
    .screen{padding-top:calc(env(safe-area-inset-top,0px) + 84px);}
    .list,.done-group,.tunti-summary,.tunti-page-calendar{padding-left:9px;padding-right:9px;}
    .sec-label{padding-left:12px;padding-right:12px;}
    .tunti-summary{gap:8px;}
    .sum-card{padding:12px 10px;}
    .sum-card .lbl{font-size:9px;}
    .sum-card .val{font-size:18px;}
    .sheet-head{padding-left:9px;padding-right:9px;}
    .sheet-body{padding-left:9px;padding-right:9px;}
    .row-card{padding:10px;}
  }


/* ============================ SETTINGS ACTIONS ============================ */
.settings-card{
  display:flex;
  align-items:center;
  gap:12px;
  border:1px solid var(--line);
  background:#fff;
  border-radius:14px;
  padding:13px;
  box-shadow:var(--shadow-card);
  margin-bottom:10px;
}
.settings-card-text{
  flex:1;
  min-width:0;
}
.settings-card-text b{
  display:block;
  font-family:'Sora';
  font-size:13.5px;
  color:var(--ink);
  margin-bottom:3px;
}
.settings-card-text span{
  display:block;
  font-size:12.5px;
  line-height:1.4;
  color:var(--ink-soft);
}
.settings-action{
  flex-shrink:0;
  border:0;
  border-radius:12px;
  background:linear-gradient(145deg,var(--accent),var(--accent-deep));
  color:#fff;
  cursor:pointer;
  font-family:'Sora';
  font-weight:700;
  font-size:13px;
  padding:11px 14px;
  touch-action:manipulation;
}
.settings-action:disabled{
  opacity:.62;
  cursor:wait;
}
.settings-action.danger{
  background:var(--danger);
}