body{background:radial-gradient(ellipse at 85% 20%,#ff790a10,transparent 50%),#0b0d10}.design-stage{max-width:1160px;padding:64px 36px;margin:auto;display:grid;grid-template-columns:1fr 390px;gap:20px 90px;align-items:center}.design-intro .brand{margin-bottom:64px}.design-intro h1{font-size:68px;letter-spacing:-3.6px;line-height:1.03;margin-bottom:24px}.design-lead{color:var(--muted);font-size:17px;line-height:1.8;max-width:450px}.design-modes{display:flex;gap:6px;background:#191e24;padding:5px;border-radius:12px;width:fit-content;margin:28px 0}.design-modes button{border:0;border-radius:8px;padding:12px 24px;color:var(--muted);background:transparent;font-weight:700}.design-modes button.active{color:#170d04;background:var(--orange)}.design-disclaimer{font-size:12px;color:var(--muted);line-height:1.8;max-width:430px}.phone-frame{border:8px solid #30343a;border-radius:48px;background:#101316;box-shadow:0 35px 100px #0009,0 0 0 2px #08090a;height:810px;overflow:hidden;display:flex;flex-direction:column;min-width:0}.phone-status{height:44px;padding:12px 20px 0;display:flex;justify-content:space-between;align-items:start;font-size:12px;font-weight:750;flex-shrink:0}.island{display:block;background:#050608;width:110px;height:25px;border-radius:20px;margin-top:-5px}.phone-header{display:flex;align-items:center;gap:10px;padding:15px 18px 17px;border-bottom:1px solid #ffffff0b}.phone-header img{border-radius:11px}.phone-header strong{font-size:13px;letter-spacing:-.2px}.phone-header small{display:block;font-size:8px;letter-spacing:1.5px;color:#9ba5af;margin-top:5px}.avatar{border:1px solid #3a424b;border-radius:50%;height:32px;width:32px;display:grid;place-items:center;font-size:10px;color:#d9dfe6;margin-left:auto}.phone-content{overflow:auto;flex:1;padding:22px 18px;scrollbar-width:thin;min-height:0}.phone-content h2{font-size:28px;letter-spacing:-1px;line-height:1.12;margin:0 0 8px;display:block}.phone-content .sub{color:var(--muted);font-size:12px;line-height:1.6;margin:0 0 22px}.phone-content .eyebrow{font-size:9px;letter-spacing:1.4px;margin:0 0 10px}.day-summary{background:linear-gradient(130deg,#ff8e29,#ff6b00);padding:18px;border-radius:16px;color:#251303;display:grid;grid-template-columns:1fr auto;align-items:center;margin-bottom:20px}.day-summary strong{font-size:30px;letter-spacing:-1px}.day-summary p{font-size:12px;margin:0 0 6px}.day-summary small{display:block;font-size:10px;line-height:1.5;opacity:.8}.day-symbol{font-size:38px;opacity:.5}.phone-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:26px}.phone-actions button{display:flex;gap:10px;align-items:center;text-align:left;border:1px solid #30363f;border-radius:12px;padding:15px 11px;color:#f2f4f7;background:#1b2026;font-size:12px;font-weight:650;min-height:56px}.phone-actions button span{color:var(--orange);font-size:21px;font-weight:400}.phone-section-title{display:flex;justify-content:space-between;align-items:center;font-size:13px;font-weight:750;margin:20px 0 12px}.phone-section-title small{font-size:10px;font-weight:400;color:var(--muted)}.job-card{display:block;width:100%;text-align:left;border:1px solid #2c333c;background:#191e24;border-radius:14px;padding:16px;margin:10px 0;color:var(--text)}.job-card .card-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:11px}.job-card .tag{font-size:9px;border-radius:6px;padding:5px 7px}.job-card time{font-size:10px;color:var(--muted)}.job-card strong{display:block;font-size:14px;margin:5px 0}.job-card p{color:var(--muted);font-size:11px;line-height:1.6;margin:6px 0}.job-card .card-foot{border-top:1px solid #ffffff0b;margin-top:12px;padding-top:12px;display:flex;justify-content:space-between;font-size:10px;color:#c3cbd4}.phone-tabs{display:flex;justify-content:space-around;border-top:1px solid #2a3038;padding:10px 4px 2px;background:#161a1f;flex-shrink:0}.phone-tabs button{min-width:0;border:0;background:none;color:#99a3ae;font-size:9px;padding:3px 8px;display:grid;gap:6px;justify-items:center}.phone-tabs button span{font-size:20px;line-height:22px}.phone-tabs button.active{color:#ff922f}.home-indicator{margin:12px auto 9px;background:#dde0e4;border-radius:5px;width:110px;height:4px;flex-shrink:0}.design-caption{grid-column:2;text-align:center;font-size:12px;color:var(--muted)}.scan-box{border:2px dashed #ff922f;border-radius:24px;aspect-ratio:1.2;display:grid;place-items:center;background:linear-gradient(135deg,#ff790a0c,#ffffff03);margin:20px 0;text-align:center;color:#ffad69;font-size:42px}.scan-box small{display:block;font-size:11px;line-height:1.6;padding:15px;color:var(--muted)}.phone-content .button{width:100%;justify-content:center;padding:13px;font-size:12px;margin-top:8px}.phone-content .quiet{display:block;text-align:center;font-size:11px;margin-top:15px}.phone-note{padding:13px;background:#ff790a0b;border:1px solid #ff790a30;border-radius:10px;color:#d1b79f;font-size:11px;line-height:1.7;margin:16px 0}.mini-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.mini-grid .job-card{margin:0;min-height:108px}.room-icon{color:var(--orange);font-size:25px;display:block;margin-bottom:10px}.progress-track{height:5px;background:#343b43;border-radius:8px;margin:15px 0 8px;overflow:hidden}.progress-track i{height:100%;display:block;background:var(--orange);width:80%}.job-counts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:18px 0}.job-counts div{background:#1d232a;border-radius:12px;text-align:center;padding:16px 4px}.job-counts strong{display:block;font-size:24px}.job-counts small{font-size:9px;color:var(--muted)}.phone-content .back{background:none;border:0;color:#ffac65;padding:0;font-size:12px;margin-bottom:20px}.design-field{display:grid;gap:8px;font-size:11px;color:#b3bdc8;margin:14px 0}.design-field input{width:100%;min-width:0}.timeline{border-left:1px solid #424b56;padding-left:16px;margin-top:18px;font-size:11px;line-height:1.7;color:var(--muted)}.timeline strong{color:var(--text);display:block}.phone-search{border:1px solid #353d47;border-radius:10px;padding:13px;color:#a5afbb;font-size:11px;margin:20px 0;background:#1a2026}@media(max-width:850px){.design-stage{grid-template-columns:1fr;gap:28px;padding:30px 20px}.design-intro{max-width:500px;margin:auto}.design-intro .brand{margin-bottom:32px}.design-intro h1{font-size:46px;letter-spacing:-2px}.design-lead{font-size:15px}.phone-frame{width:390px;max-width:100%;margin:auto;height:810px}.design-caption{grid-column:1}.design-disclaimer{font-size:11px}}@media(prefers-reduced-motion:no-preference){.job-card:hover,.phone-actions button:hover{border-color:#ff790a90;transition:border-color .15s}}
@media(max-width:850px){.design-stage{grid-template-columns:minmax(0,1fr)}.design-stage>*{min-width:0}.phone-frame{width:100%;max-width:390px}}@media(max-width:370px){.phone-header{padding-inline:12px;gap:7px}.phone-header strong{font-size:11px}.phone-header img{width:32px;height:32px}.phone-header .avatar{width:26px;height:26px}.phone-content{padding-inline:12px}.phone-actions button{font-size:11px;gap:7px;padding-inline:9px}}