/* Public products: existing KITAPOS font, indigo, white, shared chrome.
   Native HTML visuals stay legible at every breakpoint; no canvas or framework. */
.pf{padding-top:72px;background:#fff;color:var(--ink);font-family:'Plus Jakarta Sans',sans-serif;--pf-shadow:0 1px 1px -.5px #0000000f,0 3px 3px -1.5px #0000000f,0 6px 6px -3px #0000000f,0 12px 12px -6px #0000000f,0 24px 24px -12px #0000000f}
.pf-wrap{width:min(1280px,100% - 64px);margin-inline:auto}.pf h1,.pf h2,.pf h3{letter-spacing:-.045em;text-wrap:balance}.pf h1{font-size:clamp(42px,4.5vw,64px);font-weight:650;line-height:1.12}.pf h2{font-size:clamp(28px,3.1vw,42px);font-weight:600;line-height:1.2}.pf h3{font-size:22px;font-weight:600;line-height:1.3}.pf p{color:var(--muted);line-height:1.8}.pf-kicker{font-size:12px!important;letter-spacing:.09em;font-weight:650;color:var(--accent)!important;margin-bottom:22px!important}.pf-breadcrumb{display:flex;flex-wrap:wrap;gap:10px;align-items:center;min-height:66px;font-size:12px;color:var(--muted)}.pf-breadcrumb a:hover{color:var(--accent)}
.pf-hero{padding:48px 0 36px;background:radial-gradient(ellipse at 85% 25%,#eeeaff,transparent 65%),#fcfbff}.pf-hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}.pf-hero-copy{padding-block:12px}.pf-intro{font-size:17px;margin-top:24px;max-width:52ch}.pf-actions{display:flex;gap:24px;align-items:center;flex-wrap:wrap;margin-top:32px}.pf .btn-solid{display:inline-flex;gap:14px;min-height:52px;padding:14px 26px;border-radius:999px;font-size:15px;font-weight:600}.pf-text-link{display:inline-flex;gap:12px;align-items:center;color:var(--accent);font-weight:600;font-size:14px;line-height:1.6;min-height:44px}.pf-hero-visual{min-width:0;padding:20px 0}.pf-hero-visual figcaption,.pf-visual figcaption{font-size:11px;line-height:1.6;color:#675f76;margin-top:20px;text-align:center}.pf-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;padding-top:30px;margin-top:30px;border-top:1px solid #ded9eb}.pf-summary li{display:flex;align-items:center;justify-content:center;gap:9px;font-size:13px;line-height:1.6}.pf-summary svg{flex:none;color:var(--accent)}.pf .pf-hero-copy--long h1{font-size:52px;line-height:1.1}
.pf-subnav{border-block:1px solid #ece9f2;background:#fff}.pf-subnav>.pf-wrap{display:flex;align-items:center;gap:28px;min-height:72px;flex-wrap:wrap;padding-block:12px}.pf-subnav strong{font-size:14px;margin-right:auto}.pf-subnav a{display:inline-flex;align-items:center;min-height:44px;font-size:13px;line-height:1.6;padding:10px 0;color:var(--muted)}.pf-subnav a:hover,.pf-subnav a[aria-current]{color:var(--accent)}
.pf-features{padding-block:80px}.pf-feature{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:center;padding:32px 0;scroll-margin-top:112px;border-radius:24px;position:relative;outline:none}.pf-feature+.pf-feature{margin-top:80px}.pf-feature:nth-child(even) .pf-feature-copy{order:2}.pf-feature-copy>p:not(.pf-kicker){font-size:16px;margin-top:22px}.pf-feature-copy ul{margin-top:24px;display:grid;gap:14px}.pf-feature-copy li{display:flex;gap:12px;align-items:flex-start;font-size:14px;line-height:1.7}.pf-feature-copy li svg{margin-top:3px;color:var(--accent);flex:none}.pf-visual{min-width:0;background:#f0edfa;border:1px solid #e7e1f4;border-radius:26px;padding:32px}
.pf-ui{background:white;border:1px solid #ddd7eb;border-radius:20px;box-shadow:var(--pf-shadow);min-width:0;overflow:hidden;color:#292638;font-size:13px;line-height:1.5}.pf-ui-header{display:flex;gap:10px;align-items:center;padding:18px 22px;border-bottom:1px solid #eeeaf5}.pf-ui-header strong{font-size:14px;font-weight:650;line-height:1.5}.pf-ui-mark{display:grid;place-items:center;width:26px;height:26px;flex:none;border-radius:8px;background:#efecff;color:var(--accent);font-size:15px;font-weight:800}.pf-ui-dots{margin-left:auto;color:#aaa3b9;letter-spacing:2px}.pf-ui-body{padding:24px}.pf-ui-top{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:20px;color:#777187;font-size:12px}.pf-pill{display:inline-block;font-size:10px;font-weight:600;border-radius:6px;padding:5px 9px;background:#eeebff;color:#5748ba;line-height:1.5}.pf-pill.green{background:#eaf5ef;color:#286b50}.pf-pill.amber,.pf-menu-art.amber{background:#fff2e4;color:#9b5527}.pf-ui-rows>div{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:15px 0;border-bottom:1px solid #eeebf3}.pf-ui-rows>div:last-child{border-bottom:0}.pf-ui-rows span{color:#777187}.pf-ui-rows strong{font-weight:600;text-align:right;font-size:12px}.pf-ui-note{border-radius:10px;background:#f6f4fb;padding:14px 16px;font-size:11px;color:#827a94;line-height:1.8;margin-top:20px}.pf-ui-note strong{display:block;color:#524a65;font-weight:500;margin-top:4px;font-size:12px}.pf-ui-total{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-top:22px;padding-block:18px;border-top:1px solid #e6e1ef}.pf-ui-total strong{color:var(--accent);font-size:19px;letter-spacing:-.035em}.pf-ui-confirm{display:flex;gap:8px;align-items:center;padding:12px 14px;border-radius:10px;background:#edf7f1;color:#286b50;font-size:11px;margin-top:16px}.pf-ui-confirm svg{flex:none}.pf-ui-amount{padding:8px 0 24px}.pf-ui-amount>span{color:#827a94;font-size:12px;display:block;margin-bottom:8px}.pf-ui-amount>strong{font-size:36px;line-height:1.3;letter-spacing:-.04em;font-weight:650}.pf-ui-amount small{font-size:15px;font-weight:500}.pf-ui-split{display:grid;grid-template-columns:1fr 1fr;gap:14px}.pf-ui-split>div{display:flex;align-items:flex-start;flex-direction:column;gap:12px;padding:18px 14px;border:1px solid #e6e1ef;border-radius:12px}.pf-ui-split small{font-size:10px;color:#777187}.pf-ui-split strong{font-size:20px;letter-spacing:-.03em}
.pf-menu-cover{height:140px;position:relative;overflow:hidden;border-radius:12px;background:#24204f}.pf-menu-cover img{height:100%;width:100%;object-fit:cover;object-position:center 56%;opacity:.5}.pf-menu-cover>span{position:absolute;bottom:18px;left:18px;color:white;font-size:22px;font-weight:650;letter-spacing:-.03em}.pf-menu-cover small{display:block;font-weight:400;font-size:11px;letter-spacing:0;margin-top:5px}.pf-menu-list>div{display:flex;gap:14px;align-items:center;padding:16px 0;border-bottom:1px solid #eeeaf5}.pf-menu-list>div>span:nth-child(2){flex:1}.pf-menu-list strong{font-size:12px;font-weight:600}.pf-menu-list small{display:block;font-size:10px;color:#777187;margin-top:4px}.pf-menu-list b{font-size:12px;font-weight:500}.pf-menu-art{width:64px;height:64px;display:grid;place-items:center;flex:none;border-radius:12px;overflow:hidden;background:#eeeaff;color:#6454c4}.pf-menu-photo{display:block;width:100%;height:100%;object-fit:cover}.pf-product-rows{display:grid}.pf-product-row{display:grid;grid-template-columns:64px minmax(0,1fr) auto;gap:14px;align-items:center;padding:14px 0;border-bottom:1px solid #eeebf3}.pf-product-row:last-child{border-bottom:0}.pf-product-thumb{display:block;width:64px;height:64px;object-fit:cover;border-radius:12px}.pf-product-row>span{min-width:0}.pf-product-row strong{display:block;font-size:13px;font-weight:650;color:#292638}.pf-product-row small{display:block;margin-top:4px;font-size:10px;color:#777187}.pf-product-row>b{font-size:12px;font-weight:650;white-space:nowrap}
.pf-table-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.pf-table{border:1px solid #b9d9cc;background:#edf6f2;color:#247555;border-radius:10px;text-align:center;padding:14px 4px}.pf-table strong{font-size:24px;display:block;letter-spacing:-.04em}.pf-table span{font-size:9px}.pf-table.occupied{background:#941e25;border-color:#941e25;color:white}.pf-table.reserved{background:#eeeaff;border-color:#c3b9ee;color:#5541bd}.pf-table.clean{background:#edf0f4;border-color:#c9cfdb;color:#667085}.pf-reservation-date{display:flex;gap:14px;align-items:center;padding:16px;background:#f8f6fe;border-radius:12px;margin-bottom:12px}.pf-reservation-date>strong{font-size:44px;color:var(--accent);line-height:1}.pf-reservation-date>span:nth-child(2){flex:1;font-size:15px}.pf-reservation-date small{display:block;font-size:11px;color:#777187;margin-top:4px}.pf-service-card{display:flex;gap:12px;align-items:center;padding:20px 0;border-bottom:1px solid #eeeaf5}.pf-service-card>div{flex:1}.pf-service-card strong{font-size:14px;display:block}.pf-service-card small{font-size:11px;color:#777187;display:block;margin-top:5px}.pf-service-card>b{font-size:12px}.pf-avatar{display:grid;place-items:center;flex:none;width:40px;height:40px;border-radius:50%;background:#eeeaff;color:#6755be;font-size:12px;font-weight:650}
.pf-routing-source{display:flex;gap:12px;align-items:center;padding:15px 18px;background:#f1edff;border:1px solid #ded7f7;border-radius:12px;width:fit-content;margin:auto}.pf-routing-source>span{color:var(--accent)}.pf-routing-source strong{font-size:13px}.pf-routing-source small{display:block;font-size:10px;color:#777187;margin-top:5px}.pf-route-lines{display:flex;height:50px;margin-inline:16.6%;position:relative}.pf-route-lines:before{content:'';position:absolute;top:20px;left:0;right:0;border-top:1px solid #bcafe7}.pf-route-lines i{height:30px;width:1px;background:#bcafe7;position:absolute;top:20px;left:0}.pf-route-lines i:nth-child(2){top:0;height:50px;left:50%}.pf-route-lines i:nth-child(3){left:100%}.pf-tickets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.pf-tickets>div{display:flex;align-items:center;flex-direction:column;text-align:center;border:1px solid #e6e1ef;border-radius:10px;padding:14px 4px;background:#fff;min-width:0}.pf-printer-icon{margin-bottom:10px;color:#6a5fa6}.pf-tickets strong{font-size:12px}.pf-tickets small{font-size:9px;color:#827a94;margin-top:5px;line-height:1.5}.pf-ticket-bottom{font-size:9px;color:#33785d;margin-top:16px;padding-top:10px;border-top:1px dashed #dfd9ed;width:100%}.pf-kitchen-list{display:grid;gap:16px}.pf-kitchen-list>div{display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:20px;border:1px solid #e8e2f1;border-radius:12px}.pf-kitchen-list strong{font-size:21px}.pf-kitchen-list small{color:#827a94;font-size:12px}.pf-transfer{display:flex;justify-content:space-between;gap:14px;align-items:center;background:#f5f2fd;border-radius:14px;padding:20px 16px}.pf-transfer small{display:block;font-size:10px;color:#827a94;margin-bottom:5px}.pf-transfer svg{color:var(--accent);flex:none}
.pf-attendance{display:grid;grid-template-columns:120px 1fr;gap:20px;align-items:center}.pf-face-scan{position:relative;aspect-ratio:1;background:#f7f5fd;border-radius:14px;color:#7864c8}.pf-face-scan>svg{width:100%;height:100%}.pf-face-scan>i{position:absolute;left:15%;right:15%;top:22%;height:2px;background:#8163f1;opacity:0}.pf-face-scan>span{position:absolute;bottom:-3px;right:-3px;display:grid;place-items:center;width:30px;height:30px;border:3px solid white;border-radius:50%;background:#2e956b;color:white}.pf-attendance-copy>strong{display:block;font-size:22px;line-height:1.3;letter-spacing:-.04em;margin-top:12px}.pf-attendance-copy>p{font-size:11px;margin-top:10px;line-height:1.7}.pf-location{grid-column:1/-1;display:flex;gap:12px;align-items:center;padding:16px;background:#f6f4fb;border:1px solid #e5dff3;border-radius:12px}.pf-location>div{flex:1}.pf-location strong{font-size:12px}.pf-location small{display:block;font-size:10px;color:#827a94;margin-top:5px}.pf-location-pin{font-size:26px;color:var(--accent)}.pf-attendance-result{grid-column:1/-1;display:flex;gap:8px;align-items:center;font-size:11px;color:#2c7a56}.pf-simulate{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;border-radius:10px;padding:13px;background:var(--accent);color:white;font-size:12px;font-weight:600;cursor:pointer;margin-top:20px;min-height:44px}.pf-simulate:disabled{background:#ede9fc;color:#5c4aaa;cursor:default}.pf-attendance[data-stage=scan] .pf-face-scan>i{opacity:1;animation:pf-scan 1.15s ease-in-out infinite alternate}.pf-attendance[data-stage=scan] .pf-face-scan>span,.pf-attendance[data-stage=scan] .pf-location,.pf-attendance[data-stage=scan] .pf-attendance-result{opacity:.25}.pf-attendance[data-stage=location] .pf-attendance-result{opacity:.25}.pf-attendance[data-stage=location] .pf-location-pin{animation:pf-location .6s ease-in-out 2}.pf-attendance[data-stage=complete] .pf-face-scan>span{animation:pf-check .4s ease-out}.pf-attendance-result,.pf-location{transition:opacity .25s}
.pf-roster>div{display:grid;grid-template-columns:1.2fr repeat(4,1fr);gap:6px;align-items:center;margin-bottom:12px;font-size:10px}.pf-roster .pf-roster-head{color:#827a94;padding-bottom:8px}.pf-roster span:not(.pf-roster-head span){text-align:center}.pf-roster .am,.pf-roster .pm,.pf-roster .off{padding:12px 2px;border-radius:6px}.pf-roster .am{background:#eee9fd;color:#6750ae}.pf-roster .pm{background:#eaf4fa;color:#386d87}.pf-roster .off{background:#f4f3f6;color:#8c8796}.pf-payroll-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:20px}.pf-payroll-metrics>div{padding:14px 8px;background:#f5f2fc;border-radius:10px;text-align:center}.pf-payroll-metrics small{color:#827a94;font-size:10px}.pf-payroll-metrics strong{display:block;font-size:24px;color:#504184;margin-top:8px;letter-spacing:-.04em}.pf-file{padding:32px 8px;display:flex;flex-direction:column;align-items:center;gap:14px;background:#f8f6fe;border-radius:14px}.pf-file svg{width:48px;height:48px;color:#7966bc}.pf-file strong{font-size:18px}.pf-file small{font-size:11px;color:#827a94}.pf-export-formats{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:20px}.pf-export-formats span{padding:12px 10px;border:1px solid #ded8ee;border-radius:8px;text-align:center;font-size:12px}
.pf-ui-bars{display:grid;gap:19px}.pf-ui-bars>div>span{display:flex;justify-content:space-between;gap:12px;font-size:11px}.pf-ui-bars strong{font-weight:600}.pf-ui-bars i{display:block;height:7px;background:#f1eef7;margin-top:9px;border-radius:4px;overflow:hidden}.pf-ui-bars b{display:block;width:var(--value);background:#7460df;height:100%;border-radius:4px;transform-origin:left}.pf-ui-bars>div:nth-child(2) b{background:#a08de7}.pf-ui-bars>div:nth-child(3) b{background:#c0b2ee}.pf-member-card{background:linear-gradient(140deg,#5c4aee,#34247e);border-radius:14px;color:#fff;padding:24px;position:relative;overflow:hidden}.pf-member-card>span{font-size:10px;opacity:.75}.pf-member-card>strong{display:block;font-size:23px;margin:18px 0 24px;line-height:1.4;max-width:14ch;letter-spacing:-.035em}.pf-member-card>div{font-size:12px}.pf-member-card b{font-size:30px;margin-right:4px}.pf-promo-card{padding:32px 24px;background:#efebff;border-radius:14px}.pf-promo-card>span:first-child{font-size:9px;letter-spacing:.12em;color:#766897}.pf-promo-card>strong{display:block;font-size:38px;line-height:1.2;color:#453283;margin:20px 0;letter-spacing:-.05em}.pf-promo-card p{font-size:15px;margin-bottom:20px}
.pf-support{background:#f8f7fc;padding-block:80px}.pf-support-grid{display:grid;grid-template-columns:.8fr 1fr;gap:72px;align-items:center}.pf-support figure{aspect-ratio:1.25;overflow:hidden;border-radius:24px}.pf-support img{display:block;width:100%;height:100%;object-fit:cover}.pf-support p:not(.pf-kicker){font-size:16px;margin-top:24px}.pf-support .pf-text-link{margin-top:20px}.pf-faq{display:grid;grid-template-columns:.8fr 1fr;gap:72px;padding-block:96px}.pf-faq>div>p:not(.pf-kicker){margin-top:18px;font-size:14px}.pf-faq .pf-text-link{margin-top:15px}.pf-faq details{border-block-end:1px solid #e5e0ee}.pf-faq summary{display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:16px;line-height:1.6;padding:25px 0;cursor:pointer;font-weight:600;list-style:none}.pf-faq summary::-webkit-details-marker{display:none}.pf-faq summary>span{color:var(--accent);font-size:24px;font-weight:400}.pf-faq details[open] summary>span{transform:rotate(45deg)}.pf-faq details>p{padding:0 30px 24px 0;font-size:14px}.pf-section-head{display:flex;gap:30px;align-items:end;justify-content:space-between;margin-bottom:32px}.pf-section-head h2{font-size:30px;max-width:22ch}.pf-section-head>a{flex:none}.pf-related-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.pf-product-link{display:flex;gap:18px;align-items:flex-start;border:1px solid #e6e1ee;border-radius:20px;padding:26px;background:#fff;position:relative;transition:box-shadow .2s,border-color .2s}.pf-link-icon{background:#f0ecfe;color:var(--accent);padding:12px;border-radius:12px;display:flex;flex:none}.pf-product-link>svg{flex:none;color:#8f83b5;margin-left:auto}.pf-product-link>div{min-width:0}.pf-product-link h3{font-size:19px;letter-spacing:-.025em}.pf-product-link p{font-size:14px;line-height:1.7;margin-top:12px}.pf-related .pf-product-link{flex-direction:column;min-height:250px}.pf-related .pf-product-link>svg{position:absolute;top:32px;right:24px}.pf-related .pf-product-link p{font-size:14px}.pf-final{margin-top:96px;padding:80px 0;text-align:center;background:#f0ecff}.pf-final h2{font-size:clamp(32px,4vw,48px)}.pf-final p{margin:22px auto;max-width:52ch;font-size:16px}.pf-final .btn-solid{margin-top:10px}.pf-directory-hero{padding-block:80px 72px;max-width:900px;text-align:center}.pf-directory-hero h1{font-size:clamp(40px,5vw,68px)}.pf-directory-hero>p:not(.pf-kicker){font-size:18px;margin:28px auto;max-width:58ch}.pf-directory-group{padding-block:36px}.pf-directory-group>h2{font-size:26px;margin-bottom:26px}.pf-directory-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.pf-directory-group>.pf-product-link{max-width:600px}
@media(hover:hover){.pf-product-link:hover{box-shadow:var(--pf-shadow);border-color:#b6a9db}.pf-text-link:hover{text-decoration:underline;text-underline-offset:5px}}
@keyframes pf-scan{to{transform:translateY(64px)}}@keyframes pf-check{from{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}@keyframes pf-location{50%{transform:scale(1.25)}}
@media(min-width:1024px) and (max-height:820px){.pf-breadcrumb{min-height:48px}.pf-hero{padding-top:24px}.pf-hero h1{font-size:52px}.pf-hero-grid{gap:48px}.pf-hero .pf-ui-body{padding:20px}.pf-summary{margin-top:16px;padding-top:24px}}
@media(max-width:1023px){.pf{padding-top:56px}.pf-wrap{width:calc(100% - 48px)}.pf-hero-grid{gap:32px}.pf h1{font-size:44px}.pf-intro{font-size:15px}.pf-hero .pf-ui-body{padding:18px}.pf-hero .pf-attendance{grid-template-columns:80px 1fr;gap:14px}.pf-hero .pf-attendance-copy>strong{font-size:19px}.pf-ui-header{padding:16px}.pf-ui-header strong{font-size:13px}.pf-feature{gap:36px}.pf-visual{padding:20px}.pf-feature+.pf-feature{margin-top:48px}.pf-features{padding-block:56px}.pf-support-grid,.pf-faq{gap:40px}.pf-related-grid{gap:12px}.pf-related .pf-product-link{padding:20px}.pf-subnav>.pf-wrap{gap:18px}.pf-subnav a{font-size:12px}.pf-summary{gap:12px}.pf-summary li{font-size:11px}.pf-table-grid{gap:7px}.pf-table{padding:12px 2px}.pf-table strong{font-size:22px}.pf-table span{font-size:8px}.pf-attendance{grid-template-columns:90px 1fr;gap:14px}.pf-attendance-copy>strong{font-size:20px}.pf-ui-body{padding:18px}.pf-location{padding:12px}.pf-location .pf-pill{display:none}.pf-roster>div{gap:4px;font-size:9px}.pf-ui-total strong{font-size:17px}}
@media(max-width:760px){.pf-wrap{width:calc(100% - 40px)}.pf-hero{padding-top:28px}.pf-hero-grid{grid-template-columns:1fr;gap:24px}.pf-hero-copy{max-width:620px}.pf h1{font-size:36px}.pf-intro{font-size:14px;line-height:1.7}.pf-hero-visual{max-width:560px;width:100%;margin:auto;padding:4px 0}.pf-hero .pf-ui-body{padding:24px}.pf-summary{grid-template-columns:1fr 1fr;gap:16px;margin-top:32px}.pf-summary li{justify-content:flex-start;font-size:12px}.pf-subnav>.pf-wrap{gap:8px 20px;padding-block:12px}.pf-subnav strong{width:100%}.pf-subnav a{font-size:12px}.pf-feature{grid-template-columns:1fr;gap:28px;padding-block:24px;scroll-margin-top:84px}.pf-feature:nth-child(even) .pf-feature-copy{order:0}.pf-feature+.pf-feature{margin-top:48px}.pf-feature-copy>p:not(.pf-kicker){font-size:14px;line-height:1.7}.pf-visual{padding:24px}.pf-visual .pf-ui-body{padding:22px}.pf-ui-header strong{font-size:14px}.pf-ui-rows strong{font-size:12px}.pf-attendance,.pf-hero .pf-attendance{grid-template-columns:110px 1fr}.pf-attendance-copy>strong,.pf-hero .pf-attendance-copy>strong{font-size:23px}.pf-location .pf-pill{display:block}.pf-table-grid{gap:10px}.pf-table{padding:14px 3px}.pf-table span{font-size:9px}.pf-roster>div{font-size:10px;gap:6px}.pf-support{padding-block:56px}.pf-support-grid,.pf-faq{grid-template-columns:1fr;gap:32px}.pf-support figure{max-height:350px;aspect-ratio:1.4}.pf-support p:not(.pf-kicker){font-size:14px;line-height:1.7}.pf-faq{padding-block:64px}.pf-related-grid,.pf-directory-grid{grid-template-columns:1fr}.pf-related .pf-product-link{min-height:0;padding:24px;flex-direction:row;gap:16px}.pf-related .pf-product-link>div{padding-right:16px}.pf-related .pf-product-link>svg{top:26px;right:18px;width:15px}.pf-section-head{align-items:start;flex-direction:column;gap:16px}.pf-section-head h2{max-width:none;font-size:28px}.pf-final{margin-top:64px;padding-block:64px}.pf-directory-hero{padding-block:48px}.pf-directory-hero>p:not(.pf-kicker){font-size:14px;line-height:1.7}.pf-directory-group{padding-block:24px}.pf-product-link{padding:22px;gap:14px}.pf-product-link h3{font-size:19px}}
@media(max-width:380px){.pf-wrap{width:calc(100% - 32px)}.pf-visual{padding:14px}.pf-visual .pf-ui-body,.pf-hero .pf-ui-body{padding:16px}.pf-ui-header{padding:14px 12px;gap:8px}.pf-ui-header strong{font-size:12px}.pf-ui-header .pf-ui-dots{display:none}.pf-attendance,.pf-hero .pf-attendance{grid-template-columns:80px 1fr;gap:12px}.pf-attendance-copy>strong,.pf-hero .pf-attendance-copy>strong{font-size:19px}.pf-location{gap:8px}.pf-location strong{font-size:10px}.pf-location small{font-size:9px}.pf-location .pf-pill{font-size:8px;padding:4px 6px}.pf-ui-total strong{font-size:16px}.pf-table-grid{gap:6px}.pf-table span{font-size:8px}.pf-ui-rows{font-size:12px}.pf-ui-rows strong{font-size:11px}.pf-ui-split{gap:10px}.pf-ui-split strong{font-size:18px}.pf-ui-split>div{padding:14px 10px}.pf-actions{gap:12px}.pf .btn-solid{font-size:13px;padding-inline:20px}.pf-tickets{gap:6px}.pf-tickets strong{font-size:10px}.pf-tickets small{font-size:8px}.pf-tickets>div{padding-inline:2px}.pf-payroll-metrics strong{font-size:21px}.pf-roster>div{font-size:9px;gap:4px}.pf-related .pf-link-icon{padding:9px}.pf-related .pf-product-link{padding:20px 16px}.pf-related .pf-product-link>div{padding-right:10px}.pf-menu-art,.pf-product-thumb{width:56px;height:56px}.pf-product-row{grid-template-columns:56px minmax(0,1fr) auto;gap:10px}}
@media(prefers-reduced-motion:reduce){.pf *, .pf *:before,.pf *:after{animation:none!important;transition:none!important}}
/* Programmatic focus announces a section; only interactive controls need a ring. */
.public-page .pf-feature:focus{outline:none}
.pf-ui .brand-mark{width:26px;height:28px;flex:none}
.pf-ui small,.pf-ticket-bottom,.pf-ui .pf-pill{font-size:11px}
.pf-ui .pf-roster>div{font-size:11px}
.pf-ui .pf-table span{font-size:10px}
.pf-ui .pf-menu-list small{font-size:11px}
.pf-ui .pf-location small{font-size:11px}

.pf [hidden]{display:none!important}
/* Keep the panel still while scan, location and success messages change. */
.pf-attendance-copy>strong{display:flex;align-items:center;min-height:2.6em}
.pf-attendance-copy>p{min-height:3.4em}
.pf-ui-split{grid-template-columns:repeat(2,minmax(0,1fr))}
.pf-ui-split>div{min-width:0}
@media(max-width:380px){.pf-ui-amount>strong{font-size:32px}.pf-ui-split strong{font-size:16px}}

/* Product pages use the shared public theme. The illustrative product windows
   stay light like the real app preview, while the page chrome and reading
   surfaces follow dark mode with explicit contrast. */
:root[data-theme='dark'] .pf{background:var(--paper);color:var(--ink);--pf-shadow:0 20px 46px #0007}
:root[data-theme='dark'] .pf-hero{background:radial-gradient(ellipse at 85% 25%,#302b66,transparent 62%),var(--paper)}
:root[data-theme='dark'] .pf-subnav{background:var(--card);border-color:var(--line)}
:root[data-theme='dark'] .pf-summary{border-color:var(--line)}
:root[data-theme='dark'] .pf-visual{background:var(--raise);border-color:var(--line)}
:root[data-theme='dark'] .pf-support,:root[data-theme='dark'] .pf-final{background:var(--raise)}
:root[data-theme='dark'] .pf-product-link{background:var(--card);border-color:var(--line);color:var(--ink)}
:root[data-theme='dark'] .pf-faq details{border-color:var(--line)}
:root[data-theme='dark'] .pf-kicker,:root[data-theme='dark'] .pf-text-link{color:var(--accent)!important}
:root[data-theme='dark'] .pf-support figure{box-shadow:0 24px 60px #0007}

@media(max-width:1023px){.pf .pf-hero-copy--long h1{font-size:40px}}
@media(max-width:760px){.pf .pf-hero-copy--long h1{font-size:34px}}
/* Product windows are light app previews inside either page theme. Local
   variables prevent the surrounding dark palette from turning their copy white. */
.pf-ui{--ink:#292638;--muted:#625b70;--faint:#6c647e;--accent:#5142c6}
.pf-ui-dots{color:#6c647e}
.pf-ui-note,.pf-ui-amount>span,.pf-tickets small,.pf-kitchen-list small,
.pf-transfer small,.pf-location small,.pf-roster .pf-roster-head,
.pf-payroll-metrics small,.pf-file small{color:#6c647e}
.pf-ui-note strong{color:#514a64}
.pf-attendance-copy>p{color:#625b70}
.pf-routing-source small,.pf-reservation-date small{color:#675f76}
.pf-table.clean{color:#5f6879}
.pf-roster .off{color:#625d6a}
.pf-promo-card>span:first-child{color:#685681}
:root[data-theme='dark'] .pf-hero-visual figcaption,
:root[data-theme='dark'] .pf-visual figcaption{color:var(--muted)}
