@font-face{font-family:Aeonik;src:url('./assets/aeonik-regular.otf') format('opentype');font-weight:400;font-display:swap}
@font-face{font-family:Aeonik;src:url('./assets/aeonik-medium.otf') format('opentype');font-weight:500 700;font-display:swap}
:root{--taupe:#c8beb0;--ink:#0a1013;--text:#293033;--muted:#7b8589;--line:#dde3e5;--soft:#f4f6f6;--side:#eef1f2;--blue:#087fe7;--green:#13b866;--red:#de0014;--orange:#f5951f;--radius:12px;--shadow:0 26px 70px rgba(55,45,35,.25),0 3px 12px rgba(55,45,35,.18)}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--taupe);color:var(--text);font-family:Aeonik,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:14px}body{padding:clamp(14px,3vw,42px)}button,input{font:inherit}.stage{min-height:calc(100vh - clamp(28px,6vw,84px));display:grid;place-items:center}.device{width:min(1440px,100%);min-height:min(1090px,calc(100vh - clamp(28px,6vw,84px)));background:#fff;border:1px solid rgba(78,86,90,.16);border-radius:20px;box-shadow:var(--shadow);overflow:hidden;position:relative}.desktop-shell{display:grid;grid-template-columns:188px minmax(0,1fr);min-height:inherit}.sidebar{background:var(--side);border-right:1px solid var(--line);display:flex;flex-direction:column;padding:12px 8px}.brandmark{font-size:25px;font-style:italic;color:#111;padding:3px 8px 17px}.event-switch{display:flex;align-items:center;gap:8px;margin:0 4px 10px;padding-bottom:12px;border-bottom:1px solid #dce1e3;white-space:nowrap;overflow:hidden}.event-art{width:24px;height:24px;border-radius:6px;background:linear-gradient(135deg,#701128,#fb2640 42%,#ee7777 58%,#b80a27)}.event-switch span{overflow:hidden;text-overflow:ellipsis}.nav-group{color:#99a2a5;font-size:12px;margin:15px 8px 5px}.nav-item{height:36px;border-radius:8px;display:flex;align-items:center;gap:10px;padding:0 10px;color:#5e676b}.nav-item.active{background:#dfe4e6;color:#293033}.nav-icon{width:16px;text-align:center;color:#687277}.nav-badge{margin-left:auto;background:#ffe4e7;color:var(--red);border-radius:99px;min-width:18px;text-align:center;padding:2px 5px}.sidebar-user{margin-top:auto;display:flex;gap:8px;align-items:center;padding:10px 4px;color:#687277}.avatar{width:28px;height:28px;border-radius:50%;background:linear-gradient(145deg,#e8d4c4,#8d5b47);border:2px solid white;box-shadow:0 0 0 1px #dce2e4}.main{min-width:0;background:#fff}.topbar{height:52px;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 12px;font-size:14px}.topbar-actions{margin-left:auto;display:flex;gap:8px}.btn{border:1px solid var(--line);background:#fff;border-radius:8px;height:34px;padding:0 14px;color:var(--ink);display:inline-flex;align-items:center;justify-content:center;gap:7px;cursor:pointer}.btn.dark{background:#0c1215;color:#fff;border-color:#0c1215}.btn.ghost{border:0;background:transparent}.btn.active{color:var(--blue);border-color:#b9dcfb;background:#edf6ff}.content{padding:24px;background:#fff}.content.soft{background:#f2f5f5}.panel{background:#fff;border:1px solid var(--line);border-radius:10px}.panel.soft{background:#f4f6f6;border-color:transparent}.pad{padding:16px}.title{font-size:20px;line-height:28px;color:var(--ink);font-weight:400}.headline{font-size:28px;line-height:36px;color:var(--text);font-weight:400}.subtle{color:var(--muted)}.small{font-size:12px}.medium{font-weight:500}.row{display:flex;align-items:center}.gap{gap:10px}.spread{display:flex;align-items:center;justify-content:space-between}.rule{height:1px;background:var(--line)}.pill{display:inline-flex;align-items:center;gap:5px;min-height:22px;padding:2px 8px;border-radius:99px;background:#eef1f2;color:#394145;font-size:12px}.pill.green{background:#e3f8ec;color:#13713b}.pill.orange{background:#fff0df;color:#91684a}.pill.blue{background:#e8f3ff;color:#0573d7}.status-dot{width:7px;height:7px;border-radius:50%;background:currentColor}.kpi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.kpi{padding:18px 16px;min-height:108px}.kpi .value{font-size:26px;margin-top:10px}.app-header{padding:12px 12px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:14px}.app-header .event-art{width:60px;height:60px;border-radius:10px}.app-header .event-name{font-size:19px;font-weight:500}.overview{padding:26px;display:flex;justify-content:center}.overview-stack{width:768px;max-width:100%;display:grid;gap:24px}.next-card{padding:16px;border-radius:18px;background:#f3f5f5}.next-row{background:#fff;border-radius:12px;margin-top:12px;padding:18px;box-shadow:0 4px 0 rgba(35,45,48,.05)}.workflow{background:#f3f5f5;border-radius:18px;padding:4px}.workflow-tabs{display:grid;grid-template-columns:repeat(4,1fr)}.workflow-tab{padding:18px 14px;color:#758084}.workflow-tab.active{background:#fff;border-radius:10px;color:#171d20;box-shadow:0 2px 8px rgba(0,0,0,.04)}.workflow-body{background:#fff;border-radius:10px;margin-top:2px;padding:16px}.supplier-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.supplier{border:1px solid var(--line);border-radius:10px;padding:10px;display:flex;align-items:center;gap:10px}.thumb{width:42px;height:42px;border-radius:8px;background:url('./assets/proposal-hotel.jpg') center/cover}.activity{padding:18px 0;border-top:1px solid #edf0f1}.activity li{list-style:none;position:relative;padding:6px 0 6px 22px}.activity li:before{content:"";position:absolute;left:2px;top:11px;width:8px;height:8px;border-radius:50%;border:1px solid #7a8589}.activity li.live:before{border:3px solid #68a9fb;box-shadow:0 0 0 2px #e1efff}.momo{position:absolute;right:24px;bottom:24px;border:1px solid var(--line);border-radius:26px;background:#fff;padding:10px 18px;box-shadow:0 10px 30px rgba(0,0,0,.08)}
.comparison{overflow:auto}.compare-grid{display:grid;grid-template-columns:repeat(3,minmax(380px,1fr));min-width:1140px}.compare-col{border-right:1px solid var(--line)}.hotel-card{padding:16px}.hotel-image{height:196px;background:url('./assets/proposal-hotel.jpg') center 46%/cover;border-radius:6px}.hotel-name{font-size:16px;color:var(--ink);margin:12px 0 5px}.vote-row{display:grid;grid-template-columns:54px 54px 1fr;gap:6px;margin-top:14px}.section-label{height:34px;background:#f2f4f5;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:8px 16px}.compare-detail{padding:18px 16px}.money{color:#00a958;font-size:17px}.bar{height:18px;border-radius:4px;background:linear-gradient(90deg,#9ea8ac 0 89%,#0ab66b 89%)}.toast{position:absolute;right:18px;bottom:76px;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 30px rgba(0,0,0,.12);padding:12px 18px;display:grid;gap:10px;font-size:16px}
.contract-layout{background:#f2f5f5;padding:26px;display:grid;grid-template-columns:minmax(0,2fr) minmax(320px,1fr);gap:40px;min-height:calc(100% - 52px)}.contract-main{display:grid;gap:26px}.supplier-wide{display:flex;gap:14px;align-items:center;padding:10px}.supplier-photo{width:120px;height:80px;border-radius:4px;background:linear-gradient(135deg,#702452,#dd6a4a)}.check-row,.price-row{display:flex;align-items:center;min-height:54px;padding:0 12px;border-bottom:1px solid var(--line)}.check{width:18px;height:18px;border:1.5px solid var(--blue);border-radius:50%;margin-right:14px}.price-row .label{color:var(--muted);width:110px}.price-row .value{margin-left:auto;color:#111}.feedback{align-self:start;padding:16px}.choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:24px 0}.choice{border:1px solid var(--line);border-radius:8px;padding:16px}.choice.active{background:#edf6ff;border-color:var(--blue)}
.invoice{padding:24px}.invoice-head{display:flex;justify-content:space-between;align-items:center}.notice{background:#e1f7ea;color:#24734a;border:1px solid #bfeccc;border-radius:10px;padding:13px 16px;margin:18px 0}.invoice-grid{display:grid;grid-template-columns:minmax(0,1fr) 302px;gap:24px}.invoice-sheet{padding:20px}.bill-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px}.meta-grid{display:grid;grid-template-columns:100px 1fr 100px 1fr;gap:12px;margin:26px 0}.invoice-table{border:1px solid var(--line);border-radius:10px;overflow:hidden}.invoice-row{display:grid;grid-template-columns:105px 150px 1fr 105px 85px 125px 115px;padding:12px 14px;border-bottom:1px solid var(--line);align-items:center}.invoice-row.head{color:var(--muted);font-weight:500}.invoice-side .panel{padding:16px;border-radius:0}.invoice-total{display:grid;grid-template-columns:1fr auto;gap:12px;margin:28px 0 0 auto;width:52%;font-size:16px}.invoice-total strong{font-size:21px}
.city-strip{display:flex;overflow-x:auto}.city-card{min-width:32%;border-right:1px solid var(--line);padding:16px}.city-photo{width:100%;aspect-ratio:1.82;border-radius:5px;object-fit:cover}.city-title{font-size:17px;color:#101517;margin:12px 0 4px}.recommendation{display:grid;grid-template-columns:repeat(4,minmax(370px,1fr));min-width:1480px}.recommendation>div{border-right:1px solid var(--line);padding:14px 16px;line-height:1.45}.recommendation ul{margin:0;padding-left:18px}.estimate{display:grid;grid-template-columns:repeat(4,minmax(370px,1fr));min-width:1480px}.estimate>div{text-align:center;border-right:1px solid var(--line);padding:22px}.estimate strong{display:block;font-size:20px;color:#111;margin-top:6px}
.room{padding:24px 50px}.room-summary{margin-top:22px}.occupancy{display:grid;grid-template-columns:170px repeat(5,1fr) 115px;gap:6px;align-items:center;margin-top:26px}.occ{height:18px;border-radius:4px;background:#b9eab3}.occ:nth-child(3n){background:#118d31}.reservation{margin-top:18px;border-top:1px solid var(--line);padding-top:16px}.reservation-bar{height:12px;border-radius:6px;background:#a9b4c4}.chips{display:flex;gap:8px;margin:32px 0 22px}.room-list{min-height:160px;background:#f4f6f6;border-radius:12px;padding:18px}
.agenda-nav{height:42px;border-bottom:1px solid var(--line);display:flex;gap:28px;padding:0 20px;align-items:center}.agenda-nav .active{color:var(--blue);height:42px;display:flex;align-items:center;border-bottom:2px solid var(--blue)}.timeline{overflow:auto}.agenda-row{display:grid;grid-template-columns:100px 1fr;min-width:1000px;border-bottom:1px solid var(--line);padding:6px 22px}.agenda-time{font-weight:500;padding:10px 0}.agenda-cards{display:flex;gap:10px}.agenda-card{width:294px;min-height:82px;border-left:5px solid #7c8790;border-radius:8px;background:#f1f3f4;padding:10px 12px}.agenda-card.blue{background:#e4f0ff;border-color:#087fe7;color:#0871d4}.agenda-card.gold{background:#fff7d9;border-color:#6d3908}.agenda-card.peach{background:#ffeed7;border-color:#b77a48}.agenda-card.lilac{background:#efeffd;border-color:#625bea}.agenda-card.green{background:#e2f9eb;border-color:#219b54}
.email-builder{display:grid;grid-template-columns:410px minmax(0,1fr);gap:16px;padding:24px;background:#fff}.block-panel{padding:16px}.tabs{display:flex;background:#edf0f1;border-radius:9px;width:max-content;padding:3px}.tabs span{padding:5px 12px}.tabs .active{background:#fff;border-radius:6px;box-shadow:0 1px 3px rgba(0,0,0,.1)}.block-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}.block{border:1px solid var(--line);border-radius:8px;padding:18px 14px}.email-canvas{background:#f4f6f6;border:1px solid var(--line);border-radius:14px;padding:0 72px;display:flex;justify-content:center}.email-sheet{width:600px;max-width:100%;background:#fff;padding:20px 24px 50px;text-align:center}.email-sheet h1{font-family:Arial,sans-serif;font-size:48px;line-height:.9;margin:26px 0 14px;color:#000}.email-photo{height:330px;background:url('./assets/workshop-email.png') center 39%/122% auto no-repeat}.email-sheet .eyebrow{font-size:11px;letter-spacing:1.3px;font-weight:700;margin:26px 0}.email-sheet .cta{display:inline-block;background:#913018;color:#fff;border-radius:99px;padding:11px 70px;font-size:12px;letter-spacing:1px}
.approval-layout{padding:26px 32px;background:#f1f4f4;display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:24px}.brief-card{padding:16px}.brief-grid{display:grid;grid-template-columns:300px 1fr;gap:12px;margin-top:18px}.brief-grid .label{color:var(--muted)}.approvers{padding:16px;align-self:start}.approver{display:flex;gap:10px;padding:14px 0;border-bottom:1px solid var(--line)}.initial{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:#e6d7d2}.policy{grid-column:1/-1;padding:16px}.approval-footer{position:absolute;bottom:0;left:188px;right:0;height:56px;background:#fff;border-top:1px solid var(--line);display:flex;justify-content:flex-end;align-items:center;gap:10px;padding:0 16px}
.adoption{padding:24px 95px}.adoption-top{display:grid;grid-template-columns:2fr 1fr;gap:16px}.chart-panel{padding:16px}.funnel{height:180px;display:flex;align-items:flex-end;gap:55px;padding:18px;border-top:1px solid var(--line);background:linear-gradient(10deg,transparent 0 15%,#daf5e4 15% 67%,#ffe5dc 67% 82%,transparent 82%)}.funnel-bar{width:48px;background:repeating-linear-gradient(45deg,#13bb6c 0 2px,transparent 2px 5px);border-top:70px solid #e1e6e8;height:170px}.funnel-bar:last-child{background:repeating-linear-gradient(45deg,#ff5b35 0 2px,transparent 2px 5px)}.side-kpis{display:grid;gap:14px}.table-tools{margin-top:24px}.data-table{border:1px solid var(--line);border-radius:10px;overflow:auto}.data-row{display:grid;grid-template-columns:30px 260px 160px 160px 160px 160px 160px;min-width:1050px;min-height:42px;align-items:center;border-bottom:1px solid var(--line)}.data-row>*{padding:0 8px}.data-row.head{color:var(--muted);font-weight:500}
.report-shell{padding:24px;background:#e8ebec;min-height:inherit}.report-window{min-height:850px;background:#fff;border-radius:18px;box-shadow:0 8px 24px rgba(0,0,0,.12);display:grid;grid-template-columns:342px 1fr;overflow:hidden}.report-side{border-right:1px solid var(--line);position:relative}.report-side .job{padding:16px 28px;border-bottom:1px solid var(--line)}.ask-note{position:absolute;left:20px;right:20px;bottom:190px;text-align:center}.report-main{padding:32px}.report-main h1{font-weight:400}.donut-panel{margin-top:24px;height:390px;padding:18px;display:flex;flex-direction:column}.donut{width:176px;height:176px;border-radius:50%;background:conic-gradient(#635cf3 0 67%,#13bd87 67% 84%,#ff9d09 84% 91%,#f34a3f 91% 96%,#9a55d4 96% 99%,#40acc5 99%);position:relative;margin:auto}.donut:after{content:"";position:absolute;inset:39px;background:#fff;border-radius:50%}.bar-chart{margin-top:26px;padding:18px}.hbar{height:14px;background:#655cf1;width:86%;margin:30px 0 0 145px}
.mobile-device{width:min(402px,100%);height:min(874px,calc(100vh - clamp(28px,6vw,84px)));min-height:650px;background:#29292b;border-radius:42px;box-shadow:var(--shadow);overflow:hidden;position:relative;color:#fff;font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display",sans-serif}.phone-status{height:54px;display:flex;align-items:center;justify-content:space-between;padding:0 24px 0 52px;font-weight:600}.scan-head{position:relative;text-align:center;font-weight:600}.back{position:absolute;left:16px;top:8px;border:1px solid #666;border-radius:22px;padding:10px 12px;background:rgba(0,0,0,.16)}.scan-sub{font-size:12px;color:#c7c7cc;font-weight:400}.scan-area{width:246px;height:246px;margin:188px auto 0;position:relative}.corner{position:absolute;width:70px;height:70px;border:4px solid #fff}.corner.tl{left:0;top:0;border-right:0;border-bottom:0;border-radius:22px 0 0}.corner.tr{right:0;top:0;border-left:0;border-bottom:0;border-radius:0 22px 0 0}.corner.bl{left:0;bottom:0;border-right:0;border-top:0;border-radius:0 0 0 22px}.corner.br{right:0;bottom:0;border-left:0;border-top:0;border-radius:0 0 22px}.qr{position:absolute;inset:28px;border-radius:18px;background:repeating-conic-gradient(#fff 0 25%,transparent 0 50%) 0/28px 28px,#3c3c3e;border:22px solid #3c3c3e;opacity:0}.has-qr .qr{opacity:1}.scan-copy{text-align:center;font-size:17px;line-height:24px;margin-top:32px}.attendee-bg{position:absolute;top:0;left:0;right:68px;height:542px;background:#b8b8ba;color:#111;padding:76px 0 0;font-size:38px;overflow:hidden}.attendee-bg small{font-size:22px;color:#666}.has-qr .scan-area,.has-qr .scan-head,.has-qr .scan-copy,.has-qr .phone-status{position:relative;z-index:2}.has-qr:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 0 78%,#1971b9 78% 83%,transparent 83%);pointer-events:none}.ticket{position:absolute;z-index:4;left:5px;right:5px;bottom:6px;background:#fff;color:#111;border-radius:38px;padding:22px 17px 18px;box-shadow:0 -8px 30px rgba(0,0,0,.2)}.ticket:before{content:"";display:block;width:36px;height:5px;border-radius:3px;background:#c8c8ca;margin:-14px auto 16px}.ticket-head{display:flex;align-items:center;gap:10px;font-weight:600;font-size:17px}.ticket-head .avatar{width:30px;height:30px}.ticket-head .going{margin-left:auto;color:#24ba5b;font-size:12px}.ticket-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px 24px;margin-top:20px}.ticket-grid span{display:block;color:#8e8e93;font-size:12px;margin-bottom:4px}.checked{border-top:1px solid #ddd;margin-top:22px;padding-top:20px;text-align:center;color:#22c15a;font-size:17px}.success{position:absolute;z-index:6;top:116px;left:104px;background:#31c680;border-radius:10px;padding:12px 14px;font-size:17px;font-weight:500}
@keyframes breathe{50%{transform:translateY(-3px);box-shadow:0 15px 32px rgba(0,0,0,.13)}}[data-motion="float"]{animation:breathe 3.4s ease-in-out infinite}@keyframes scan{0%{transform:translateY(-80px);opacity:0}20%,80%{opacity:1}100%{transform:translateY(80px);opacity:0}}.has-qr .qr:after{content:"";position:absolute;left:-16px;right:-16px;top:50%;height:2px;background:#43b3ff;box-shadow:0 0 12px #43b3ff;animation:scan 2.8s linear infinite}
@container product (max-width:760px){body{padding:10px}.device{border-radius:15px;min-height:calc(100vh - 20px)}.desktop-shell{grid-template-columns:1fr}.sidebar{display:none}.content,.invoice,.room,.adoption{padding:16px}.topbar{position:sticky;top:0;background:#fff;z-index:8}.app-header{align-items:flex-start}.app-header .event-art{width:44px;height:44px}.overview{padding:16px}.workflow-tabs{overflow-x:auto;grid-template-columns:repeat(4,150px)}.supplier-grid,.kpi-grid,.contract-layout,.invoice-grid,.bill-grid,.email-builder,.approval-layout,.adoption-top{grid-template-columns:1fr}.contract-layout{padding:16px;gap:16px}.feedback{order:-1}.meta-grid{grid-template-columns:100px 1fr}.invoice-row{grid-template-columns:100px 120px 260px 80px 60px 90px 90px;min-width:800px}.invoice-table{overflow:auto}.invoice-total{width:100%}.city-card{min-width:86%}.room{padding:16px}.occupancy{grid-template-columns:80px repeat(5,1fr) 70px;gap:3px}.email-canvas{padding:0 10px}.email-sheet h1{font-size:36px}.email-photo{height:230px}.approval-footer{left:0}.adoption{padding:16px}.funnel{gap:20px}.report-shell{padding:8px}.report-window{grid-template-columns:1fr}.report-side{display:none}.report-main{padding:20px}.headline{font-size:22px}.momo{display:none}.mobile-device{height:calc(100vh - 20px);border-radius:34px}.scan-area{margin-top:130px}}