/* Happymento Play — compact interaction-first surfaces. */
:root{font-family:ui-rounded,'Segoe UI',system-ui,sans-serif;color:#29243e;background:#f8f7fc;--green:#7545e8;--muted:#7b768e;--line:#eeebf5;--lime:#f2ecff;--red:#c24f30}
body{background:#f8f7fc}button,a{touch-action:manipulation}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline-color:#b49af4}button:active,.btn:active{transform:scale(.98)}
.brand{font-size:21px;letter-spacing:-1px}.brand-mark{background:#7545e8;transform:rotate(-6deg);box-shadow:0 3px 0 #ded0ff}.brand-mark span{color:#ffe38d}.brand .small{display:none}.brand-sub{font-size:9px;color:#998baa;margin-top:16px;margin-bottom:36px}.sidebar{background:#fff;border-color:var(--line);width:205px}.shell{grid-template-columns:205px minmax(0,1fr)}.sidebar-profile{border-color:var(--line)}.nav a{color:#7b738d;border-radius:14px;font-size:13px}.nav a:hover{background:#f8f4ff}.nav a.active{color:#7545e8;background:#f0e9ff}.nav-label{color:#a29aae}.topbar{height:80px;background:#fff;border-bottom:1px solid var(--line)}.breadcrumb{color:#a29bad}.breadcrumb b{color:#6d5c87}.date-label{color:#8a819a}.avatar{background:#ffeadc;color:#ba6534;font-weight:800}.icon-button{border-color:var(--line);border-radius:14px}.notification-dot{background:#ff794e;min-width:17px;padding:3px}.main{padding-top:30px;max-width:1300px}.page-home{max-width:1120px}.page-heading{margin-bottom:24px}.page-heading h1{font-weight:800;letter-spacing:-1px;font-size:30px}.greeting-sub{font-size:13px;color:var(--muted);margin-top:6px}.btn{border-radius:13px;border-color:#e9e3f2;font-size:13px;min-height:46px}.btn.primary{background:#7545e8;border-color:#7545e8;box-shadow:0 3px 0 #5c30c5}.btn.primary:hover{background:#6738da}.btn:hover{background:#f7f2ff}.btn.danger{color:#c24f30}.link-button{font-size:12px;color:#7545e8;font-weight:700;min-height:44px}.badge{background:#f0e8ff;color:#7949c8;border-radius:8px;font-size:11px;padding:6px 9px}.badge.urgent,.badge.overdue{background:#fff0d6;color:#965509}.badge.working{background:#dff7ee;color:#237c60}.badge.blocked{background:#f0eff5;color:#787284}.panel,.order-card,.list-card,.table-wrap{border-color:var(--line);border-radius:18px}.panel h2{font-size:15px}.filter-bar input,.filter-bar select{border-color:#e8e3f1;border-radius:12px}.tabs{background:#eee8f8;border-radius:13px}.tabs button{font-size:12px;border-radius:10px;min-height:40px}.tabs button.active{color:#7545e8;font-weight:700}.calendar-day{border-color:#f0edf7;border-radius:12px}.calendar-day.selected{background:#7545e8}.calendar-day.today{border-color:#b399e8}.calendar-day .dots{color:#a888df}.calendar-day.selected .dots{color:#fff}.calendar-weekday{color:#8b7d9e}.summary-strip strong{color:#7545e8}.summary-strip{color:var(--muted)}.completion-title{font-size:14px}.completion-sub{font-size:11px;color:#8e849d}.completion-time{font-size:12px;color:#8d789b}.check-circle{background:#e2f6eb;color:#318565}.completion-row{border-color:#f1edf6}.progress-native::-webkit-progress-value{background:#9c78ee}.progress-native::-webkit-progress-bar{background:#f0e9fc}.empty{background:#f6f1ff;border:0;border-radius:20px}.empty h3{color:#5b3b8a}.empty svg{color:#9465e5}.help,.detail-list p{font-size:13px;color:var(--muted)}.detail-list b{color:#4d3c63}label{font-size:12px}input,select,textarea{color:#3c304e;border-color:#e6deef;font-size:14px;border-radius:12px}input[type=checkbox]{accent-color:#7545e8}.dialog-header{border-color:var(--line);padding:18px 22px}.dialog-header h2{font-size:20px;font-weight:800}dialog{border:0;border-radius:24px;box-shadow:0 24px 80px #34205135}dialog::backdrop{background:#30204760;backdrop-filter:blur(5px)}.dialog-content{padding:22px}.notification-item{border-color:#ede6f6;border-radius:14px}.notification-item.unread{background:#f4efff;border-color:#decffb}.notification-item h3{font-size:14px}.notification-item p{font-size:12px}.team-person{border-color:var(--line);padding:16px 0}.person-heading{font-size:14px}.person-task{font-size:12px;color:#8b8199}.status{font-size:10px;color:#8a8198}.status.working{color:#208a68}.status.working::before{background:#2bbc8a}.step-number{background:#ede3ff;color:#7946d0}.order-detail-meta{color:#8b779e}.workflow-step{border-color:#f0eaf7;font-size:13px}.activity-row{border-color:#eee7f7;font-size:13px}.activity-row p{font-size:12px;color:#8c7b9c}.activity-row svg{color:#a07bda}.activity-row time{color:#9784a4}.repeat-row{border-color:#eee7f7;font-size:14px}.repeat-row p{font-size:12px}.step-form{background:#faf7ff}.login-story{background:#efe4ff}.login-story h1{color:#6339be;font-weight:850;font-size:64px}.login-story p{color:#9379ac}.login-story footer{color:#a18bac}.login-form h2{font-weight:800;color:#3f2d5b}.login-form form>p:last-child:empty{display:none}.offline-banner{font-size:12px;background:#fff0da;color:#9d6526}#toast{background:#3e2b59;font-size:13px;border-radius:16px}.skeleton{background:#eae0f8}
.play-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:2px 0 24px}.hello{font-size:14px;font-weight:600;color:#88739d;line-height:1.4;margin-bottom:5px}.hello span{font-size:16px}.play-heading h1{font-size:30px;letter-spacing:-1.2px;font-weight:850;line-height:1.2}.xp-pill{background:#fff0cf;color:#9c670e;border:1px solid #ffe4a5;border-bottom-width:3px;border-radius:14px;display:flex;align-items:center;justify-content:center;gap:5px;white-space:nowrap;font-size:13px;font-weight:800;min-height:43px;padding:9px 12px}.xp-pill svg{width:17px;height:17px}.play-layout{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:28px;align-items:start}.focus-card{background:#7545e8;color:#fff;border-radius:28px;padding:21px 26px 8px;box-shadow:0 7px 0 #e5dafb;min-width:0;position:relative;overflow:hidden}.focus-card-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:5px}.focus-label{font-size:10px;font-weight:750;letter-spacing:1.5px;display:flex;align-items:center;gap:7px;color:#e8dcff}.focus-label svg{height:15px;width:15px}.focus-more{height:36px;width:40px;border-radius:10px;background:#ffffff16;color:#fff;font-size:18px;letter-spacing:1px;line-height:1}.focus-more:hover{background:#ffffff30}.focus-symbol{height:60px;width:60px;display:flex;align-items:center;justify-content:center;border-radius:20px;background:#ffb694;color:#853908;box-shadow:0 4px 0 #5632b52a;transform:rotate(-8deg);margin:20px 0 20px}.focus-symbol svg{height:29px;width:29px;stroke-width:1.8;transform:rotate(8deg)}.focus-card h2{font-size:32px;font-weight:800;color:white;line-height:1.13;letter-spacing:-1px;margin-bottom:9px;text-wrap:balance;overflow-wrap:anywhere}.focus-subtitle{font-size:12px;line-height:1.6;color:#e2d3fc;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.focus-tags{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:17px 0 25px}.focus-tags>span:first-child{display:inline-flex;align-items:center;gap:5px;color:#eee4ff;font-size:12px}.focus-tags svg{height:14px;width:14px}.focus-tags .badge{background:#ffe5ab;color:#875204;font-size:10px;padding:5px 8px}.focus-go{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:56px;border-radius:17px;background:#e4ff91;border:1px solid #e4ff91;box-shadow:0 4px 0 #4e2cb566;color:#354519;font-size:16px;font-weight:800;padding:14px 18px;transition:transform .15s,background .15s}.focus-go:hover{background:#d6fc70}.focus-go>svg:first-child{height:19px;width:19px}.focus-go>svg:last-child{margin-left:auto;width:19px}.focus-go>svg:first-child:not(:last-child){margin-right:auto}.focus-bottom{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:10px}.focus-bottom button{min-height:47px;display:flex;align-items:center;gap:5px;padding:6px 0;color:#e6d9fc;font-size:12px;font-weight:550}.focus-bottom button:hover{color:#fff}.focus-bottom svg{height:14px;width:14px}.focus-timer{display:flex;flex-direction:column;align-items:center;gap:6px;margin:0 0 24px;padding:17px 0;border-top:1px solid #ffffff25}.focus-timer .timer{font-size:39px;color:#fff;font-weight:750;letter-spacing:1px}.focus-timer>span:last-child{color:#ddd0f6;font-size:11px}.is-working .focus-symbol{background:#e4ff91;color:#648626;animation:focus-breathe 3s ease-in-out infinite}.is-working .focus-tags{margin-bottom:12px}.next-column{padding-top:2px}.next-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.next-heading h2{font-size:17px;font-weight:800;letter-spacing:-.4px}.next-heading h2 span{font-size:11px;font-weight:650;padding:4px 7px;background:#eee7fb;color:#916acf;border-radius:7px;margin-left:5px}.mini-queue{display:flex;flex-direction:column;gap:11px}.mini-task{display:flex;align-items:center;text-align:left;gap:12px;background:#fff;border:1px solid #ede8f5;padding:14px 13px;border-radius:17px;width:100%;min-height:78px;transition:border-color .15s,transform .15s}.mini-task:hover{border-color:#c5a8f1}.mini-task-icon{display:flex;align-items:center;justify-content:center;border-radius:13px;height:44px;width:44px;flex-shrink:0}.tone-0{background:#fff0db;color:#d28a30}.tone-1{background:#e7f5ff;color:#5096c8}.mini-task-text{display:flex;flex-direction:column;gap:6px;flex:1;min-width:0}.mini-task-text strong{font-size:13px;font-weight:700;line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mini-task-text small{font-size:11px;color:#9c90a9;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mini-task>svg{height:15px;width:15px;color:#b3a4c1}.next-empty{padding:23px 14px;color:#978aa5;font-size:13px;display:flex;gap:9px;align-items:center;background:#f0ebf8;border-radius:16px}.next-empty svg{color:#9c7fc1;width:17px}.home-shortcuts{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:20px}.home-shortcuts button{border:1px solid #ece6f3;background:#fff;border-radius:17px;text-align:left;padding:15px 12px;display:flex;gap:9px;flex-wrap:wrap;align-items:center}.home-shortcuts button>span:nth-child(2){flex:1}.home-shortcuts b{font-size:12px;display:block;white-space:nowrap}.home-shortcuts small{font-size:10px;color:#9a8ca9;display:block;margin-top:5px}.home-shortcuts button>svg{display:none}.shortcut-icon{width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;border-radius:12px;flex-shrink:0}.shortcut-icon svg{height:19px;width:19px}.peach{background:#fff0e5;color:#e67b41}.mint{background:#e1f6ed;color:#39a581}.lilac{background:#eee4ff;color:#9461de}.yellow{background:#fff5d8;color:#cfa239}.pink{background:#ffe8f1;color:#d96c9a}.blue{background:#e5f2ff;color:#529cda}.caught-up{padding:32px 25px;text-align:center;min-height:320px;background:#7545e8}.caught-up .big-emoji{display:block;font-size:52px;margin:5px 0 18px}.caught-up h2{font-size:28px}.caught-up p{font-size:13px;color:#e3d5fc;line-height:1.6;margin:14px 0 25px}
.sheet-menu{display:flex;flex-direction:column;gap:6px}.sheet-menu button{display:flex;align-items:center;gap:13px;min-height:58px;text-align:left;font-size:14px;font-weight:600;border-radius:12px;padding:12px;background:#f9f6ff}.sheet-menu button>svg:first-child{color:#9972d4}.sheet-menu button>svg:last-child{margin-left:auto;width:16px;color:#bba9cf}.sheet-task-name{font-size:13px;color:#8a7b9b;margin-bottom:18px}.work-detail-heading{display:flex;align-items:center;gap:12px;margin-bottom:18px}.work-detail-heading h3{font-size:21px;line-height:1.3}.detail-description{font-size:14px;line-height:1.75;color:#7d6e8f;white-space:pre-line}.detail-facts{margin:23px 0;display:grid;gap:0}.detail-facts>div{display:flex;align-items:baseline;justify-content:space-between;gap:20px;padding:12px 0;border-bottom:1px solid #f1edf7;font-size:13px}.detail-facts dt,.detail-facts>div>span{color:#9786a8;flex-shrink:0}.detail-facts dd{margin:0;text-align:right;color:#574168;font-weight:600}.queue-sheet{display:flex;flex-direction:column;gap:10px}.compact-disclosure{margin-top:13px;background:#f5f0fb;border-radius:15px;padding:0 16px}.compact-disclosure summary{cursor:pointer;min-height:52px;display:flex;align-items:center;gap:8px;font-size:12px;color:#8d72ac;font-weight:650;list-style:none}.compact-disclosure summary::-webkit-details-marker{display:none}.compact-disclosure summary svg{width:16px}.compact-disclosure summary svg:last-child{margin-left:auto}.compact-disclosure[open] summary{margin-bottom:10px}.compact-disclosure .mini-task{margin-bottom:10px}.progress-hero{text-align:center;padding:15px 0 25px}.progress-hero>span{font-size:42px;display:block}.progress-hero strong{display:block;font-size:42px;letter-spacing:-1.5px;color:#7545e8;font-weight:850;margin:12px 0}.progress-hero p{font-size:12px;color:#9b8aa9}.progress-facts{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0 0 25px}.progress-facts>div{text-align:center;background:#f5f0fc;padding:20px;border-radius:15px}.progress-facts strong{font-size:24px;display:block;color:#6a4693}.progress-facts span{font-size:11px;color:#9580a9;margin-top:7px;display:block}.crew-sheet{margin-bottom:24px}
.studio-hub{max-width:760px;margin:auto}.studio-pulse{display:grid;grid-template-columns:repeat(3,1fr);padding:18px 5px;background:#eee6fc;border-radius:20px;gap:10px;margin-bottom:25px}.studio-pulse a,.studio-pulse button{display:flex;flex-direction:column;text-align:center;gap:6px;min-height:56px;justify-content:center}.studio-pulse strong{font-size:27px;font-weight:850;color:#7c4eca;line-height:1}.studio-pulse span{font-size:11px;color:#9b80bb}.hub-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.hub-tile{padding:22px 16px;background:white;border:1px solid #eee6f7;border-radius:21px;display:flex;flex-direction:column;align-items:flex-start;gap:9px;transition:transform .15s,border-color .15s}.hub-tile:hover{transform:translateY(-2px);border-color:#cbb5eb}.hub-icon{display:flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:16px;margin-bottom:6px}.hub-tile strong{font-size:16px;font-weight:750}.hub-tile>span:last-child{font-size:11px;color:#a190b0}.studio-numbers{margin-top:22px}.studio-numbers .detail-facts{margin:0;padding-bottom:10px}.win-celebration{position:fixed;z-index:150;left:50%;top:25%;transform:translateX(-50%);background:#fff;border:2px solid #e8dcff;border-bottom:6px solid #c6aced;border-radius:26px;padding:25px 32px;box-shadow:0 15px 70px #59338235;display:flex;flex-direction:column;align-items:center;gap:10px;pointer-events:none;animation:win-pop 2.4s both;white-space:nowrap}.win-celebration strong{display:flex;gap:9px;align-items:center;font-size:21px;color:#7041c9;font-weight:850}.win-celebration strong svg{color:#39ae7f}.win-celebration>span:last-child{font-size:14px;color:#b08624;font-weight:700}.win-spark{position:absolute;color:#f6b645;font-size:36px}.win-spark.one{top:-23px;right:5px;transform:rotate(15deg)}.win-spark.two{bottom:-17px;left:8px;color:#b08ef0;font-size:25px}.win-spark.three{left:-20px;top:9px;color:#80d7b7;font-size:23px}@keyframes win-pop{0%{opacity:0;transform:translateX(-50%) scale(.8)}12%,85%{opacity:1;transform:translateX(-50%) scale(1)}100%{opacity:0;transform:translateX(-50%) translateY(-12px)}}@keyframes focus-breathe{50%{transform:rotate(-4deg) scale(1.04)}}
@media(max-width:1180px){.shell{grid-template-columns:185px minmax(0,1fr)}.sidebar{width:185px}.play-layout{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:20px}.focus-card{padding:17px 20px 7px}.focus-card h2{font-size:28px}.home-shortcuts{grid-template-columns:1fr}.home-shortcuts button{padding:12px}.home-shortcuts button>svg{display:block;width:14px;color:#b2a1c4}.play-heading h1{font-size:27px}}
@media(max-width:860px){.play-layout{grid-template-columns:1fr}.play-home{max-width:520px;margin:auto}.home-shortcuts{grid-template-columns:1fr 1fr}.home-shortcuts button>svg{display:none}.next-column{padding-top:0}.hub-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:680px){.shell{display:block}.topbar{height:69px;padding:10px 20px;padding-top:max(10px,env(safe-area-inset-top));background:#f8f7fc;border:0}.brand{font-size:20px}.brand-mark{height:31px;width:30px;font-size:27px;line-height:31px;border-radius:10px;padding-left:6px}.brand-mark span{font-size:17px;right:5px;top:-5px}.header-actions{gap:10px}.header-actions .icon-button{background:#fff;width:42px;height:42px;min-width:42px;min-height:42px}.header-actions .avatar{width:34px;height:34px}.main{padding:15px 20px 100px}.page-heading{gap:14px;margin:3px 0 22px}.page-heading h1{font-size:28px}.greeting-sub{font-size:12px}.page-heading>.btn{font-size:12px;padding:11px 15px}.play-heading{margin:2px 0 21px;align-items:center;gap:8px}.hello{font-size:13px;margin-bottom:5px}.play-heading h1{font-size:24px;letter-spacing:-1px;max-width:220px}.xp-pill{font-size:11px;min-height:38px;padding:7px 9px;border-radius:12px;gap:3px}.xp-pill svg{width:14px;height:14px}.play-layout{gap:24px}.focus-card{border-radius:24px;padding:15px 20px 4px;box-shadow:0 6px 0 #e4d8f9}.focus-label{font-size:9px;letter-spacing:1.4px}.focus-symbol{height:48px;width:48px;border-radius:16px;margin:13px 0 16px}.focus-symbol svg{height:25px;width:25px}.focus-card h2{font-size:29px;letter-spacing:-.8px;margin-bottom:7px}.focus-subtitle{font-size:11px}.focus-tags{margin:13px 0 21px}.focus-tags>span:first-child{font-size:11px}.focus-go{min-height:53px;font-size:15px;border-radius:15px}.focus-bottom{margin-top:6px}.focus-bottom button{font-size:11px;min-height:44px}.focus-timer{margin-bottom:19px;padding:13px 0 0}.focus-timer .timer{font-size:35px}.is-working .focus-symbol{display:none}.is-working .focus-card-top{margin-bottom:18px}.next-heading{margin-bottom:5px}.next-heading h2{font-size:16px}.next-heading .link-button{font-size:11px;min-height:34px}.mini-queue{gap:8px}.mini-task{padding:11px 12px;min-height:69px;border-radius:16px;gap:11px}.mini-task-icon{height:38px;width:38px;border-radius:12px}.mini-task-icon svg{height:19px;width:19px}.mini-task-text strong{font-size:13px}.mini-task-text small{font-size:10px}.home-shortcuts{margin-top:14px;gap:10px}.home-shortcuts button{padding:13px 10px;gap:8px}.home-shortcuts b{font-size:11px}.home-shortcuts small{font-size:9px}.home-shortcuts .shortcut-icon{height:29px;width:29px;border-radius:10px}.home-shortcuts .shortcut-icon svg{width:17px;height:17px}.caught-up{min-height:290px;padding:25px 22px}.caught-up .big-emoji{font-size:44px}.caught-up h2{font-size:27px}.mobile-nav{border:1px solid #ede4f7;border-bottom:0;background:#fff;backdrop-filter:blur(10px);padding:8px 9px calc(8px + env(safe-area-inset-bottom));border-radius:23px 23px 0 0;box-shadow:0 -4px 25px #593a8508}.mobile-nav a{color:#a799b8;font-size:10px;font-weight:650;min-width:66px;gap:5px;min-height:47px}.mobile-nav a.active{background:#f0e7ff;color:#8b55e3;border-radius:15px}.mobile-nav svg{width:20px;height:20px}dialog{border-radius:26px 26px 0 0;max-height:88dvh}.dialog-header{padding:17px 20px}.dialog-content{padding:20px}.dialog-header h2{font-size:20px}.dialog-actions{flex-wrap:wrap}.dialog-actions .btn{min-width:100px}.help{font-size:12px}.studio-pulse{margin-bottom:20px;padding:17px 2px;border-radius:18px;gap:3px}.studio-pulse strong{font-size:25px}.studio-pulse span{font-size:10px}.hub-grid{gap:12px}.hub-tile{border-radius:19px;padding:17px 15px;gap:7px}.hub-icon{width:42px;height:42px;border-radius:14px;margin-bottom:4px}.hub-tile strong{font-size:15px}.hub-tile>span:last-child{font-size:10px}.studio-numbers{margin-top:17px}.table-wrap tr{border-color:#eee6f7;border-radius:17px}.table-wrap th,.table-wrap td{color:#57426c}.calendar-grid{gap:3px}.calendar-day{border-radius:9px}.calendar-toolbar h2{font-size:14px}.summary-strip strong{font-size:24px}.completion-title{font-size:13px}.completion-sub{font-size:10px}.completion-time{font-size:11px}.tabs button{font-size:11px}.login-story{padding:27px 25px}.login-story h1{font-size:40px;margin:30px 0 12px}.login-story .eyebrow,.login-story>div>p{display:none}.login-form{padding:32px 25px}.login-form h2{font-size:26px}input,select,textarea{font-size:16px}.win-celebration{padding:24px 22px}.win-celebration strong{font-size:20px}#toast{bottom:88px}}
@media(max-width:360px){.main{padding-left:16px;padding-right:16px}.topbar{padding-left:16px;padding-right:16px}.play-heading h1{font-size:22px}.xp-pill{padding:7px;font-size:10px}.brand{font-size:18px}.focus-card h2{font-size:27px}.home-shortcuts button{padding:12px 8px}.home-shortcuts .shortcut-icon{display:none}}
@media(prefers-reduced-motion:reduce){.win-celebration,.is-working .focus-symbol{animation:none}.hub-tile:hover{transform:none}.win-celebration{opacity:1}*{scroll-behavior:auto!important}}

@media(max-width:680px){.mini-queue{flex-direction:row;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin-right:-20px;padding-right:20px;padding-bottom:3px}.mini-queue .mini-task{flex:0 0 86%;min-width:0;scroll-snap-align:start}.mini-queue::-webkit-scrollbar{display:none}.compact-disclosure #password-form{padding-bottom:18px}}
.compact-crew{display:none}
/* The phone home is a viewport-sized app screen, with overflow in sheets only. */
@media(max-width:680px){
  body:has(.page-home){overflow:hidden;overscroll-behavior-y:none}
  .shell:has(.page-home){height:100dvh;min-height:0;overflow:hidden}
  .workspace:has(.page-home){height:100%;min-height:0}
  .workspace:has(.page-home) .topbar{height:calc(64px + env(safe-area-inset-top));padding-top:calc(10px + env(safe-area-inset-top));padding-bottom:10px}
  .page-home{height:calc(100dvh - 134px - env(safe-area-inset-top) - env(safe-area-inset-bottom));padding:8px 20px 12px;overflow:hidden}
  .play-home{height:100%;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);gap:14px;max-width:520px}
  .play-home>*{min-width:0}
  .play-heading{margin:0;min-height:48px;min-width:0}
  .play-heading>div{min-width:0}.hello{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .play-heading h1{font-size:24px;white-space:nowrap;max-width:none}
  .hello{font-size:12px;margin-bottom:4px}
  .play-layout{min-height:0;min-width:0;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto;gap:17px;align-items:stretch}
  .focus-column{min-height:0;min-width:0;height:100%}
  .focus-card{height:100%;min-height:0;display:flex;flex-direction:column;padding:13px 20px 0;border-radius:24px}
  .focus-card-top{flex-shrink:0;margin:0 0 6px;min-height:30px}
  .focus-more{height:32px}
  .focus-symbol{height:clamp(35px,6dvh,53px);width:clamp(35px,6dvh,53px);margin:clamp(4px,1dvh,10px) 0 14px;flex-shrink:0}
  .focus-symbol svg{height:24px;width:24px}
  .focus-card h2{font-size:clamp(24px,3.6dvh,32px);line-height:1.13;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;flex-shrink:0;margin-bottom:6px}
  .focus-subtitle{flex-shrink:0;line-height:1.4}
  .focus-tags{margin:12px 0 15px;flex-shrink:0}
  .focus-go{margin-top:auto;min-height:50px;flex-shrink:0;padding:12px 16px}
  .focus-bottom{flex-shrink:0;margin-top:4px}
  .focus-bottom button{min-height:42px}
  .focus-timer{flex-shrink:0;margin:0 0 14px;padding:12px 0 0}
  .focus-timer .timer{font-size:clamp(28px,4.3dvh,39px);line-height:1.15}
  .is-working .focus-card-top{margin-bottom:10px}
  .has-timer .focus-symbol{display:none}
  .next-column{min-height:0;min-width:0}
  .next-heading{margin:0 0 5px;min-height:33px}
  .mini-queue .mini-task{min-height:65px}
  .home-shortcuts{margin-top:11px}
  .home-shortcuts button{min-height:59px;padding:10px}
  .caught-up{justify-content:center;padding:20px}
  .caught-up .focus-go{margin-top:8px}
  .caught-up h2{display:block}
  .caught-up p{margin:8px 0 18px}
  .shell:has(.page-home) .mobile-nav{height:calc(70px + env(safe-area-inset-bottom));padding:8px 9px calc(8px + env(safe-area-inset-bottom));align-items:center}
  .workspace:has(.page-home) .offline-banner{position:fixed;top:calc(64px + env(safe-area-inset-top));left:12px;right:12px;z-index:20;border-radius:12px;padding:10px;font-size:11px}
}
@media(max-width:680px) and (max-height:760px){
  .page-home{padding-top:5px;padding-bottom:10px}
  .play-home{gap:10px}.play-layout{gap:12px}
  .focus-symbol{height:35px;width:35px;margin:3px 0 10px;border-radius:12px}
  .focus-symbol svg{height:20px;width:20px}
  .focus-tags{margin:8px 0 12px}
  .has-timer .mini-queue,.has-timer .next-empty{display:none}
  .focus-timer{padding-top:8px;margin-bottom:10px;gap:3px}
}
@media(max-width:680px) and (max-height:700px){
  .workspace:has(.page-home) .topbar{height:calc(59px + env(safe-area-inset-top))}
  .shell:has(.page-home) .mobile-nav{height:calc(64px + env(safe-area-inset-bottom));padding-top:5px;padding-bottom:calc(5px + env(safe-area-inset-bottom))}
  .page-home{height:calc(100dvh - 123px - env(safe-area-inset-top) - env(safe-area-inset-bottom))}
  .play-heading{min-height:42px}.play-heading h1{font-size:22px}.hello{font-size:11px}
  .focus-symbol,.mini-queue,.next-empty{display:none}
  .focus-card{padding-top:11px}.focus-card h2{font-size:25px}
  .focus-subtitle{font-size:10px}.focus-go{min-height:48px;padding:10px 15px}
  .focus-bottom button{min-height:39px}
  .focus-timer .timer{font-size:31px}.focus-timer>span:last-child{font-size:10px}
}
@media(max-width:680px) and (max-height:620px){
  .home-shortcuts{display:none}.compact-crew{display:inline-flex;margin-left:auto;margin-right:17px}
  .play-layout{gap:12px}.next-heading{margin:0}.focus-card h2{font-size:25px}
  .has-timer .focus-subtitle{display:none}.has-timer .focus-tags{margin:5px 0 10px}
  .caught-up .big-emoji{font-size:37px;margin:3px 0 13px}
}
@media(max-width:360px){.play-heading h1{font-size:21px}.page-home{padding-left:16px;padding-right:16px}}
@media(max-width:680px) and (min-height:621px) and (max-height:700px){.play-home:not(.has-timer) .focus-symbol{display:flex;height:38px;width:38px;margin:7px 0 15px}}
@media(max-width:680px) and (min-height:560px) and (max-height:620px){.play-home:not(.has-timer) .focus-symbol{display:flex;height:35px;width:35px;margin:5px 0 12px;border-radius:12px}}
