#syncBadge{border:1px solid var(--line);background:var(--green-soft);color:var(--green-dark);border-radius:20px;padding:8px 12px;font-size:11px;-webkit-app-region:no-drag;max-width:240px;white-space:nowrap}
#syncBadge.needs-attention{background:#fff2dd;color:#875716}
.sync-dialog{width:min(520px,calc(100% - 24px));max-height:90dvh;overflow:auto;border:1px solid var(--line);border-radius:22px;padding:26px;background:var(--panel);color:var(--ink);box-shadow:0 24px 90px #142c3333;user-select:text}
.sync-dialog::backdrop{background:#13261d66;backdrop-filter:blur(4px)}
.sync-head{display:flex;justify-content:space-between;gap:12px;align-items:center}
.sync-head h2{margin:8px 0;font-size:24px;letter-spacing:-.05em}
.sync-dialog button{border:1px solid var(--line);border-radius:10px;background:var(--panel);padding:10px 13px;min-height:44px;font-size:13px}
.sync-dialog button:disabled{opacity:.5;cursor:default}
.sync-dialog button.sync-primary{background:var(--green);color:white;border-color:var(--green)}
.sync-dialog #syncClose{font-size:24px;line-height:1;padding:6px 12px;align-self:flex-start}
.sync-form{display:grid;gap:15px;margin:20px 0}
.sync-form[hidden],#connectedActions[hidden]{display:none}
.sync-form label{display:grid;gap:8px;font-size:13px;font-weight:600}
.sync-form input{width:100%;padding:12px;border:1px solid var(--line);border-radius:10px;background:var(--side);font-size:16px;outline-offset:3px}
.sync-actions{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}
.sync-help,.sync-import p{font-size:12px;line-height:1.8;color:var(--muted);overflow-wrap:anywhere}
.sync-help p{color:var(--ink)}
.sync-import{margin-top:24px;padding:18px;border-radius:14px;background:var(--green-soft);font-size:14px}
#syncMessage{font-size:13px;line-height:1.7;color:var(--danger)}
.conflict-card{border:1px solid #dfb789;border-radius:12px;padding:15px;margin:12px 0;font-size:13px}
.conflict-card p{white-space:pre-wrap;overflow-wrap:anywhere;max-height:140px;overflow:auto;font-size:12px;line-height:1.6}
.conflict-card button{margin:5px 5px 0 0}
.web-app #miniBtn,.web-app #pinBtn,.web-app #minBtn,.web-app #closeBtn,.web-app .opacity-bar,.web-app .clock{display:none}
.web-app .topbar{-webkit-app-region:no-drag}
button:focus-visible,a:focus-visible{outline:3px solid var(--green);outline-offset:3px}
@media(max-width:720px){
  html,body{height:auto;min-height:100%;overflow:auto;overscroll-behavior-y:none}
  body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI','Malgun Gothic',sans-serif;-webkit-text-size-adjust:100%}
  .app{height:auto;min-height:100dvh;padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom)}
  .topbar{height:64px;padding:0 12px 0 16px;position:sticky;top:0;background:var(--panel);z-index:5}
  .brand{font-size:11px;gap:7px}.brand-mark{width:26px;height:26px}
  .top-right{gap:6px}.win-controls{height:auto}.win-btn{width:36px;height:44px}
  .top-right>.status,.top-right>.clock{display:none}
  #syncBadge{font-size:10px;padding:8px 9px;max-width:175px;overflow:hidden;text-overflow:ellipsis}
  .content{display:flex;flex-direction:column;flex:none;min-height:0}
  .calendar-area{padding:22px 14px 14px;border-right:0;border-bottom:1px solid var(--line)}
  .heading{margin-bottom:18px}.eyebrow{font-size:9px}.month-title{font-size:25px}.month-title span{font-size:11px;margin-left:5px}
  .nav{gap:4px}.nav button{min-height:40px}.today-btn{padding:0 9px}
  .days{min-height:330px;grid-auto-rows:minmax(55px,auto);flex:none}.day{min-width:0;padding:5px 2px 4px;min-height:55px}
  .day-num{font-size:12px}.lunar-day{font-size:8px}.chip{font-size:8px;line-height:15px;height:15px;padding-left:3px}
  .legend{flex-wrap:wrap;gap:8px;margin-top:14px}.legend-hint{display:none}
  .side{padding:24px 18px 30px;min-height:320px;overflow:visible}.side-date{font-size:24px}
  .add-btn{min-height:44px;font-size:13px}.events{margin-bottom:6px}
  .event-card{padding:14px 10px 14px 13px;gap:12px}.event-title{font-size:15px}.event-note{font-size:12px}.event-meta{font-size:11px}
  .event-check,.todo-check{width:22px;height:22px}.event-check:checked::after{line-height:19px;font-size:15px}
  .small-action{min-width:32px;min-height:36px}.event-actions{opacity:1}
  .todo-add input,.todo-edit{font-size:16px;min-height:44px}.todo-add button{min-width:44px}.todo-text{font-size:14px}.todo-item{min-height:48px}
  .footer{height:46px;padding:0 16px;font-size:9px;gap:8px}.footer button{min-height:40px}
  .modal-backdrop{padding:12px;align-items:center}.modal{width:100%;max-width:480px;max-height:90dvh;overflow:auto;padding:20px}
  .field input,.field textarea,.field select{font-size:16px;min-height:44px}.form-row{gap:10px}.cal-type-hint{font-size:10px}
  .settings-modal{max-height:90dvh;overflow:auto}.setting-row{flex-wrap:wrap;gap:12px}.setting-row .seg{flex-wrap:wrap}
  .sync-dialog{padding:22px 18px}.sync-head h2{font-size:23px}
  .toast{max-width:calc(100vw - 32px);white-space:normal;bottom:24px}
}
