/* Hallmark · macrostructure: Photographic · theme: approved pixel classroom · enrichment: character illustration · nav: existing brand and admin · footer: inline links */
/* Hallmark · pre-emit critique: P5 H5 E4 S5 R5 V5. User-approved artwork; real HTML controls and live lesson data. */
html,body{overflow-x:clip}
body.public-app.pixel-classroom{background:var(--color-pixel-paper);color:var(--color-pixel-ink)}
.public-app.pixel-classroom>.visitor-topbar,.public-app.pixel-classroom>main,.public-app.pixel-classroom>.visitor-footer{width:100%;max-width:var(--layout-pixel-width);margin-inline:auto;padding-inline:20px}
.public-app.pixel-classroom>.visitor-topbar{height:72px;gap:12px;border:0;background:var(--color-pixel-surface)}
.pixel-classroom .brand{gap:10px;min-width:0}
.pixel-classroom .brand-mark{width:46px;height:40px;line-height:36px;font-size:38px;letter-spacing:-6px;border-radius:0;background:transparent;color:var(--color-pixel-purple);transform:none;padding-right:4px}
.pixel-classroom .brand-mark span{color:var(--color-pixel-teal)}
.pixel-classroom .brand b,.pixel-classroom .brand b>span{color:var(--color-pixel-ink);font-size:17px;letter-spacing:-.06em;white-space:nowrap}
.pixel-classroom .brand small{display:none}
.pixel-classroom .admin-entry{display:inline-flex;align-items:center;gap:5px;min-height:44px;padding:0;font-size:12px;line-height:1;white-space:nowrap;flex-shrink:0;color:var(--color-pixel-purple-strong)}
.pixel-classroom .admin-entry .icon{width:15px;height:15px}
.pixel-classroom>main{min-height:70vh}
.pixel-classroom .visitor-home{max-width:none;margin-inline:-20px;padding:0 0 24px}
.pixel-classroom .visitor-welcome.pixel-welcome{position:relative;margin:0;background:var(--color-pixel-surface);isolation:isolate}
.pixel-classroom .pixel-classroom-scene{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}
.pixel-classroom .pixel-welcome-copy{position:absolute;top:7%;left:8%;max-width:55%;pointer-events:none}
.pixel-classroom .visitor-welcome .pixel-greeting{margin:0;font-family:var(--font-body);font-size:var(--text-pixel-greeting);font-weight:900;line-height:1.15;letter-spacing:-.055em;color:var(--color-pixel-ink);overflow-wrap:anywhere}
.pixel-classroom .pixel-greeting strong{display:block;margin-top:4px;font-size:1.18em;font-weight:900;line-height:1.12;color:var(--color-pixel-purple-strong)}
.pixel-classroom .visitor-home>.today-lesson,.pixel-classroom .visitor-home>.visitor-participation,.pixel-classroom .visitor-home>.visitor-explore{margin-inline:20px}
.pixel-classroom .visitor-home>.today-lesson{position:relative;margin-top:12px;padding:18px 18px 16px;border:0;border-radius:var(--radius-pixel-card);background:var(--color-pixel-surface);box-shadow:var(--shadow-pixel-card)}
.pixel-classroom .today-label{gap:8px;font-size:14px;line-height:1.2;color:var(--color-pixel-purple-strong)}
.pixel-classroom .today-label>.icon{width:20px;height:20px}
.pixel-classroom .lesson-duration{font-size:11px;background:var(--color-pixel-paper);color:var(--color-pixel-muted)}
.pixel-classroom .today-lesson h2{position:relative;margin:14px 64px 8px 0;min-height:1.4em;font-size:clamp(1.25rem,4.8vw,1.75rem);line-height:1.4;font-weight:850;letter-spacing:-.055em;color:var(--color-pixel-ink);overflow-wrap:anywhere}
.pixel-classroom .today-lesson .portal-meta{margin:8px 60px 16px 0;font-size:13px;color:var(--color-pixel-muted);gap:0}
.pixel-classroom .today-lesson .portal-meta>span:first-child{display:block}
.pixel-classroom .today-lesson .portal-meta>span:first-child>.icon,.pixel-classroom .today-lesson .portal-meta>span:nth-child(n+2){display:none}
.pixel-classroom .today-link{display:flex;align-items:center;justify-content:center;gap:12px;min-height:50px;margin:0;padding:12px;border:0;border-radius:12px;background:var(--color-pixel-purple);color:var(--color-pixel-surface);font-size:clamp(.8125rem,3.5vw,1rem);font-weight:750;line-height:1.4;transition:background-color var(--dur-hover) var(--ease-out)}
.pixel-classroom .today-link>span{white-space:nowrap}
.pixel-classroom .today-link>.icon{width:20px;height:20px;flex-shrink:0}
.pixel-classroom .today-link:hover,.pixel-classroom .today-link:active{background:var(--color-pixel-purple-strong);color:var(--color-pixel-surface)}
.pixel-classroom .pixel-art-icon{display:block;width:64px;height:64px;flex-shrink:0;background-image:url("images/participation-icons-v1.webp");background-size:200% 200%;background-repeat:no-repeat}
.pixel-classroom .pixel-potato{background-position:0 0}
.pixel-classroom .pixel-survey{background-position:100% 0}
.pixel-classroom .pixel-signature{background-position:0 100%}
.pixel-classroom .pixel-message{background-position:100% 100%}
.pixel-classroom .pixel-today-art{position:absolute;right:16px;top:46px;width:72px;height:72px}
.pixel-classroom .visitor-participation{margin-top:24px}
.pixel-classroom .visitor-section-heading{display:block;margin-bottom:12px}
.pixel-classroom .visitor-section-heading h2{margin:0;font-size:21px;font-weight:850;line-height:1.4;letter-spacing:-.06em;color:var(--color-pixel-ink)}
.pixel-classroom .participation-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:10px}
.pixel-classroom .participation-card,.pixel-classroom .participation-card.survey{display:flex;align-items:center;flex-wrap:nowrap;gap:12px;min-height:82px;padding:9px 14px 9px 8px;border:1px solid transparent;border-radius:var(--radius-pixel-card);background:var(--color-pixel-surface);box-shadow:none;transition:border-color var(--dur-hover) var(--ease-out)}
.pixel-classroom .participation-card:hover,.pixel-classroom .participation-card:active{border-color:var(--color-pixel-purple);box-shadow:none}
.pixel-classroom .participation-card .participation-copy{flex:1 1 auto;min-width:0}
.pixel-classroom .participation-card .participation-copy strong{font-size:16px;line-height:1.4;font-weight:750;letter-spacing:-.055em;color:var(--color-pixel-ink);white-space:nowrap}
.pixel-classroom .participation-card>.icon{margin-left:0;width:20px;height:20px;flex-shrink:0;color:var(--color-pixel-purple)}
.pixel-classroom .visitor-explore{margin-top:14px;padding-top:0;border:0}
.pixel-classroom .explore-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:0}
.pixel-classroom .explore-grid>a{min-height:48px;padding:8px 4px;gap:8px;border:0}
.pixel-classroom .explore-grid strong{font-size:13px;line-height:1.4;font-weight:650;color:var(--color-pixel-purple-strong);white-space:nowrap;letter-spacing:-.045em}
.pixel-classroom .explore-grid>a>.icon{width:14px;height:14px;color:var(--color-pixel-purple);margin-left:auto}
.pixel-classroom .explore-symbol{width:26px;height:26px;background:transparent;color:var(--color-pixel-purple)}
.pixel-classroom .explore-symbol.muan{background:transparent;color:var(--color-pixel-purple)}
.public-app.pixel-classroom>.visitor-footer{padding-top:16px;padding-bottom:24px;flex-direction:column;align-items:flex-start;gap:4px;border-color:var(--color-pixel-rule);color:var(--color-pixel-muted)}
.pixel-classroom>.visitor-footer b,.pixel-classroom>.visitor-footer span{color:var(--color-pixel-muted)}
.pixel-classroom>.visitor-footer .footer-home-link{display:inline-flex;align-items:center;min-height:44px;color:var(--color-pixel-purple-strong);font-weight:700;text-decoration:underline;text-underline-offset:4px}
.pixel-classroom :is(a,button,input,textarea,select):focus-visible{outline:3px solid var(--color-pixel-purple-strong);outline-offset:3px}
.pixel-classroom :is(.cards,.resource-grid,.detail-grid,.prepare-grid,.form-grid,.two-columns,.qr-grid,.timeline-block,.timeline-links,.gallery,.portal-guide){grid-template-columns:minmax(0,1fr)}
.pixel-classroom .prepare-menu{position:static;display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
.pixel-classroom .detail-hero{display:block}
.pixel-classroom .detail-icon{display:none}
.pixel-classroom .media-editor .row{display:block}
.pixel-classroom .field :is(input,textarea,select){font-size:16px;min-height:48px}
.pixel-classroom .portal-flow li{grid-template-columns:24px minmax(0,1fr) auto;gap:10px}
@media(min-width:414px){.pixel-classroom .explore-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.pixel-classroom .explore-symbol{display:none}}
@media(max-width:359px){.pixel-classroom .participation-card,.pixel-classroom .participation-card.survey{gap:8px;padding-right:10px;min-height:76px}.pixel-classroom .participation-card .pixel-art-icon{width:54px;height:54px}.pixel-classroom .participation-card .participation-copy strong{font-size:14px}.pixel-classroom .brand b{font-size:15px}.pixel-classroom .admin-entry{font-size:11px}}
@media(prefers-reduced-motion:reduce){.pixel-classroom .today-link,.pixel-classroom .participation-card{transition:none}}
@media print{.pixel-classroom .pixel-welcome,.pixel-classroom .pixel-art-icon{display:none}.public-app.pixel-classroom>main{max-width:none;width:auto;padding:0}.pixel-classroom .qr-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Visitor sequence and supplied product photograph; existing pixel theme. */
.pixel-classroom .visitor-action-list{display:grid;gap:18px;margin:0;padding:0;list-style:none}
.pixel-classroom .visitor-action-list>li{display:grid;gap:5px;min-width:0}
.pixel-classroom .visitor-step-number{font-size:12px;font-weight:800;line-height:1.4;color:var(--color-pixel-purple-strong)}
.pixel-classroom .visitor-action-list .today-lesson{position:relative;margin:0;padding:18px;border:0;border-radius:var(--radius-pixel-card);background:var(--color-pixel-surface);box-shadow:var(--shadow-pixel-card)}
.pixel-classroom .visitor-action-list .today-lesson h2{margin-right:0}
.pixel-classroom .visitor-action-list .today-lesson .portal-meta{margin-right:0}
.pixel-classroom .visitor-action-list .visitor-explore{margin:0;padding:0}
.pixel-classroom .visitor-explore h2{margin:0 0 6px;font-size:16px;line-height:1.4;color:var(--color-pixel-ink)}
.pixel-classroom .product-photo{position:relative;display:block;flex:0 0 auto;width:64px;aspect-ratio:1;overflow:hidden;background:var(--color-pixel-surface);border-radius:10px}
.pixel-classroom .product-photo img{position:absolute;display:block;width:281.956522%;max-width:none;height:auto;left:-30.434783%;top:-39.130435%}
.pixel-classroom .survey-product{display:flex;align-items:center;gap:16px;margin:0 0 24px;padding:16px;border:1px solid var(--color-pixel-rule);border-radius:var(--radius-pixel-card);background:var(--color-pixel-surface)}
.pixel-classroom .survey-product .product-photo{width:clamp(104px,30vw,180px)}
.pixel-classroom .survey-product figcaption{display:grid;gap:8px;min-width:0}
.pixel-classroom .survey-product strong{font-size:20px;line-height:1.4;color:var(--color-pixel-ink);overflow-wrap:anywhere}
.pixel-classroom .survey-product figcaption>span,.pixel-classroom .survey-product small{font-size:13px;line-height:1.6;color:var(--color-pixel-muted)}
.pixel-classroom .lesson-info-dialog{width:calc(100% - 24px);max-width:560px;max-height:88dvh;margin:auto;padding:0;border:1px solid var(--color-pixel-rule);border-radius:var(--radius-pixel-card);background:var(--color-pixel-surface);color:var(--color-pixel-ink);overflow-y:auto;overscroll-behavior:contain}
.pixel-classroom .lesson-info-dialog::backdrop{background:var(--color-pixel-ink);opacity:.45}
.pixel-classroom .lesson-dialog-toolbar{position:sticky;top:0;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px;border-bottom:1px solid var(--color-pixel-rule);background:var(--color-pixel-surface)}
.pixel-classroom .lesson-dialog-toolbar button{min-height:44px}
.pixel-classroom .lesson-modal-content{padding:20px}
.pixel-classroom .lesson-modal-content>.portal{padding:0}
.pixel-classroom .lesson-modal-content .portal-guide{grid-template-columns:minmax(0,1fr)}
body.pixel-classroom:has(.lesson-info-dialog[open]){overflow-y:hidden}
.public-app.pixel-classroom>.visitor-footer{align-items:center;gap:0;text-align:center}
.pixel-classroom .footer-brand-row{display:flex;align-items:center;justify-content:center;flex-wrap:nowrap;gap:20px;width:100%}
.pixel-classroom .footer-brand-row>b{font-size:14px;color:var(--color-pixel-ink);white-space:nowrap}
.pixel-classroom>.visitor-footer .footer-home-link{font-size:14px;white-space:nowrap}
.pixel-classroom>.visitor-footer>span{font-size:12px}
@media(max-width:359px){.pixel-classroom .participation-card .product-photo{width:54px}.pixel-classroom .survey-product{gap:12px;padding:12px}.pixel-classroom .survey-product strong{font-size:18px}.pixel-classroom .lesson-modal-content{padding:16px}.pixel-classroom .footer-brand-row{gap:16px}}

/* Strong reading contrast across the visitor pages and lesson-info dialog. */
.public-app.pixel-classroom{--ink:var(--color-pixel-ink);--sub:var(--color-pixel-muted);--color-muted:var(--color-pixel-muted)}
.public-app.pixel-classroom main :is(h1,h2,h3,h4,strong,b,p,li,dt,dd,legend,label,input,textarea,select){color:var(--color-pixel-ink)}
.public-app.pixel-classroom main :is(p,li,label,legend){font-weight:500}
.public-app.pixel-classroom :is(.visitor-eyebrow,.portal-kicker,.portal-meta,.label,.help,.participation-help,.registration-note,.connection-note,.project-session,.project-timeline small,.project-plan-note,.lesson-standard,.optional-label,.results-heading>span,.vote-result>div>span,.admin-tool-list div>span,.about-activity-list div>span,.received-message>span){color:var(--color-pixel-muted)}
.public-app.pixel-classroom :is(.survey-option>span,.registration-note>strong,.lesson-goals>strong,.vote-result strong,.admin-tool-list strong,.about-activity-list strong){color:var(--color-pixel-ink)}
.public-app.pixel-classroom :is(input,textarea)::placeholder{color:var(--color-pixel-muted);opacity:1}
.public-app.pixel-classroom :is(.participation-help,.help,.project-plan-note,.lesson-standard){font-size:13px!important}
.public-app.pixel-classroom .results-refresh{color:var(--color-pixel-muted)!important}
.public-app.pixel-classroom .survey-option input{accent-color:var(--color-pixel-purple-strong)}
.public-app.pixel-classroom .participation-feedback{color:var(--color-pixel-purple-strong);font-weight:600}
.public-app.pixel-classroom .visitor-footer>span{color:var(--color-pixel-muted);font-size:13px;font-weight:500}
.pixel-classroom .finish-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:16px}
.pixel-classroom .finish-actions>.btn{min-width:0;min-height:46px;font-size:13px;white-space:nowrap;background:var(--color-pixel-surface);color:var(--color-pixel-purple-strong);border-color:var(--color-pixel-rule)}
.pixel-classroom .finish-actions>.btn:hover{background:var(--color-pixel-paper);border-color:var(--color-pixel-purple)}
.pixel-classroom .finish-actions>.btn:active{background:var(--color-pixel-rule)}
.pixel-classroom .finish-status{font-size:13px;min-height:1.7em;margin:8px 0 0}
.pixel-classroom .app-guide-dialog{width:calc(100% - 24px);max-width:520px;max-height:88dvh;margin:auto;padding:0;border:1px solid var(--color-pixel-rule);border-radius:var(--radius-pixel-card);background:var(--color-pixel-surface);color:var(--color-pixel-ink);overflow-y:auto}
.pixel-classroom .app-guide-dialog::backdrop{background:var(--color-pixel-ink);opacity:.45}
.pixel-classroom .lesson-dialog-toolbar h2{font-size:18px;margin:0}
.pixel-classroom .finish-guide-body{padding:20px}
.pixel-classroom .finish-guide-body p{font-size:15px;line-height:1.8}
.pixel-classroom .finish-guide-body input{width:100%;min-height:48px;font-size:16px;border:1px solid var(--color-pixel-rule);border-radius:8px;padding:10px;background:var(--color-pixel-surface)}
body.pixel-classroom:has(.app-guide-dialog[open]){overflow-y:hidden}
@media(max-width:359px){.pixel-classroom .footer-brand-row{gap:12px}.pixel-classroom .footer-brand-row>b,.pixel-classroom>.visitor-footer .footer-home-link{font-size:13px}}
.pixel-classroom .project-concepts{margin:32px 0;padding-top:24px;border-top:1px solid var(--color-pixel-rule)}
.pixel-classroom .project-concepts>header{text-align:center}
.pixel-classroom .project-logo{display:block;width:min(240px,80%);height:auto;margin:0 auto 20px}
.pixel-classroom .project-concepts h2{font-size:23px;line-height:1.5;margin:0 0 10px}
.pixel-classroom .project-concepts>header p{font-size:15px;line-height:1.8}
.pixel-classroom .concept-note{padding:14px 16px;border-radius:12px;background:var(--color-pixel-surface);font-size:14px;line-height:1.8}
.pixel-classroom .concept-gallery{display:grid;grid-template-columns:minmax(0,1fr);gap:20px;margin-top:20px}
.pixel-classroom .concept-gallery figure{margin:0;min-width:0;overflow:hidden;border:1px solid var(--color-pixel-rule);border-radius:var(--radius-pixel-card);background:var(--color-pixel-surface)}
.pixel-classroom .concept-gallery a{display:block}
.pixel-classroom .concept-gallery img{display:block;width:100%;height:auto}
.pixel-classroom .concept-gallery figcaption{display:grid;gap:6px;padding:16px}
.pixel-classroom .concept-gallery strong{font-size:17px;line-height:1.5}
.pixel-classroom .concept-gallery figcaption>span{font-size:13px;color:var(--color-pixel-muted)}
.pixel-classroom .product-concept-link{display:block;min-height:44px;align-content:center;line-height:1.6;color:var(--color-pixel-purple-strong);text-decoration:underline;text-underline-offset:3px}
.pixel-classroom .project-return-nav{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:4px 12px}
.pixel-classroom .project-return-nav>a{display:inline-flex;align-items:center;min-height:44px;white-space:nowrap;color:var(--color-pixel-purple-strong)}
.pixel-classroom .project-survey-return{display:flex;min-height:50px;margin-top:20px;font-size:14px;white-space:nowrap}

/* Actual field-trip photos precede the clearly labelled packaging concepts. */
.pixel-classroom .project-field-trip{margin:32px 0;padding-top:24px;border-top:1px solid var(--color-pixel-rule)}
.pixel-classroom .project-field-trip h2{font-size:23px;line-height:1.5;margin:8px 0 10px}
.pixel-classroom .project-field-trip>header p{font-size:15px;line-height:1.8}
.pixel-classroom .field-trip-gallery{display:grid;grid-template-columns:minmax(0,1fr);gap:20px;margin-top:20px}
.pixel-classroom .field-trip-gallery figure{margin:0;min-width:0;overflow:hidden;border:1px solid var(--color-pixel-rule);border-radius:var(--radius-pixel-card);background:var(--color-pixel-surface)}
.pixel-classroom .field-trip-gallery a{display:block}
.pixel-classroom .field-trip-gallery img{display:block;width:100%;height:auto}
.pixel-classroom .field-trip-gallery figcaption{display:grid;gap:6px;padding:16px}
.pixel-classroom .field-trip-gallery strong{font-size:17px;line-height:1.5}
.pixel-classroom .field-trip-gallery figcaption>span{font-size:13px;color:var(--color-pixel-muted)}