/* PALOMAI EXPERIENCE 01 · Editorial studio UI, 3.4.17 */
:root{font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;color-scheme:light}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#e9eee9}body{font:400 16px/1.5 Inter,system-ui,-apple-system,"Segoe UI",sans-serif;color:#172c24}
[hidden]{display:none!important}button{font:inherit}.pm-experience{min-height:100vh;display:flex;flex-direction:column;background:#f5f5f0;overflow:hidden}.px-top{height:68px;padding:0 clamp(18px,4vw,58px);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #dce1d9;background:#fff}.px-brand{display:flex;align-items:center;gap:12px}.px-symbol{height:37px;width:37px;display:grid;place-items:center;border-radius:7px;background:#145842;color:#fff;font-size:25px;font-weight:900;letter-spacing:-3px}.px-symbol span{color:#b9df68}.px-brand strong{display:block;font-size:13px;letter-spacing:.18em;font-weight:850;line-height:1.2}.px-brand small{display:block;color:#77847c;font-size:9px;letter-spacing:.14em;margin-top:3px}.px-top-right{display:flex;align-items:center;gap:12px;font-size:10px;letter-spacing:.12em;font-weight:780;color:#60786b}.px-top-dot,.px-led,.px-legend-dot{width:7px;height:7px;border-radius:50%;display:inline-block;background:#37a86e}.px-time{font-family:ui-monospace,Consolas,monospace;letter-spacing:0;background:#edf3ed;padding:8px 12px;border-radius:5px;font-size:13px;color:#254638}.px-main{flex:1;width:100%;max-width:1320px;margin:auto;padding:clamp(24px,3.7vw,50px)}.px-eyebrow{font-size:11px;font-weight:830;letter-spacing:.17em;color:#278155;display:flex;align-items:center;gap:12px}.px-dash{width:21px;height:2px;background:#2c9e6a}.px-intro{min-height:570px;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:8%;}.px-intro h1,.px-finish h2{font-size:clamp(45px,5.25vw,81px);line-height:1.025;letter-spacing:-.075em;margin:24px 0;color:#182e27;font-weight:850}.px-intro h1 em,.px-finish h2 em{color:#207750;font-style:normal}.px-lead{max-width:540px;color:#5a6e62;font-size:clamp(16px,1.45vw,20px);line-height:1.7}.px-meta{display:flex;flex-wrap:wrap;gap:11px;margin:27px 0}.px-meta span{font-size:10px;font-weight:800;letter-spacing:.1em;background:#e7ebe4;color:#4b6257;padding:9px 11px;border-radius:5px}.px-primary{border:0;border-radius:7px;background:#1a7553;color:white;padding:16px 23px;display:inline-flex;align-items:center;justify-content:space-between;min-width:254px;gap:18px;font-weight:790;cursor:pointer;box-shadow:0 8px 28px #1a755322;transition:background .2s,transform .2s}.px-primary:hover{background:#11563e;transform:translateY(-2px)}.px-primary span{font-size:23px;font-weight:350}.px-fine{font-size:12px;color:#78847a;margin:15px 0 0;max-width:560px}.px-preview{aspect-ratio:1.2;max-width:570px;background:#203b33;padding:17px;border:1px solid #2f5848;box-shadow:0 30px 65px #122b2226;position:relative;transform:rotate(1deg);border-radius:8px}.px-preview-top,.px-preview-bottom{color:#b4cdbf;font-size:10px;letter-spacing:.13em;display:flex;justify-content:space-between;padding:4px 4px 12px;font-weight:760}.px-preview-bottom{padding:13px 0 0;font-size:8px}.px-rec{color:#c9f1c1}.px-preview-scene{height:80%;position:relative;overflow:hidden;background:linear-gradient(138deg,#d3bd9e,#efdcc3 46%,#bf9873);border-radius:3px;box-shadow:inset 0 0 40px #72543b3d}.px-preview-paper{position:absolute;left:19%;top:27%;width:34%;height:48%;background:#f7f2e5;transform:rotate(-13deg);box-shadow:0 9px 20px #4c281f32}.px-preview-wallet{position:absolute;right:20%;top:22%;width:21%;height:19%;border-radius:6px;background:#694d3e;box-shadow:inset 0 -5px #3d2b27,0 8px 15px #311a1933;transform:rotate(9deg)}.px-preview-keys{position:absolute;left:29%;top:53%;font-size:76px;color:#c3924c;transform:rotate(-20deg);text-shadow:0 3px 6px #855e2e}.px-preview-hand{position:absolute;right:-8%;bottom:18%;width:65%;height:25%;background:#ad7659;border-radius:90px 0 0 40px;transform:rotate(-18deg);border:2px solid #885840}.px-preview-sticker{position:absolute;bottom:8%;left:8%;font-weight:780;font-size:10px;color:#233c32;letter-spacing:.15em}.px-footer{border-top:1px solid #dfe4dc;padding:16px clamp(18px,4vw,58px);display:flex;justify-content:space-between;gap:10px;color:#89958b;font-size:9px;letter-spacing:.13em;font-weight:760}.px-play{max-width:1200px;margin:auto}.px-play-head{display:flex;justify-content:space-between;gap:24px;align-items:flex-end}.px-play-head h2{font-size:clamp(26px,3.3vw,43px);letter-spacing:-.06em;line-height:1.14;margin:9px 0}.px-play-head p{font-size:14px;color:#64776b;margin:0 0 8px}.px-scene-counter{text-align:right}.px-scene-counter small{display:block;font-size:9px;letter-spacing:.17em;color:#7a8e80;font-weight:800}.px-scene-counter strong{font-size:31px;font-family:ui-monospace,Consolas,monospace;letter-spacing:-.06em}.px-scene-counter strong span{font-size:15px;color:#819288}.px-progress{height:4px;background:#dce7dd;margin:22px 0;overflow:hidden}.px-progress>span{display:block;width:0;height:100%;background:#2b8c60;transition:width .3s}.px-studio{border:1px solid #d5dfd4;background:white;box-shadow:0 12px 38px #23453516;border-radius:8px;padding:14px}.px-studio-toolbar,.px-studio-footer{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;font-size:11px;letter-spacing:.07em;color:#426150;font-weight:760;padding:4px 6px 14px}.px-studio-toolbar>span{display:flex;align-items:center;gap:10px}.px-toolbar-muted{color:#829387;font-weight:500}.px-studio-status{font:720 12px ui-monospace,Consolas,monospace;color:#2f7e57}.px-studio-footer{padding:12px 6px 0;color:#6f8176;font-size:11px}.px-studio-footer>div{display:flex;align-items:center;gap:8px}.px-stage{width:100%;overflow:hidden;background:#d5bca0;border-radius:5px;border:1px solid #c7ad91;}.px-stage-canvas{position:relative;width:100%;aspect-ratio:2.25;min-height:285px;background:repeating-linear-gradient(1deg,#ffffff0d 0 1px,transparent 1px 70px),linear-gradient(130deg,#ddc5a8 0%,#e9d5bc 39%,#c5a381 100%);isolation:isolate;overflow:hidden}.px-stage-canvas:before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 48%,#fff5 0%,transparent 68%),linear-gradient(130deg,#301a0c24,transparent 31%,#422a1430);pointer-events:none}.px-desk-stripe{position:absolute;left:0;top:50%;width:100%;height:2px;background:#a67e5730;transform:rotate(-4deg);pointer-events:none}.px-place{position:absolute;width:28%;height:33%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;transform:translate(-50%,-50%)}.px-place-a{left:17%;top:27%}.px-place-b{left:50%;top:25%}.px-place-c{left:83%;top:27%}.px-place-d{left:17%;top:75%}.px-place-e{left:50%;top:75%}.px-place-f{left:83%;top:75%}.px-place-graphic{width:min(78%,150px);height:70%;max-height:120px;display:block;position:relative;filter:drop-shadow(5px 7px 7px #553b2861)}.px-place-label{background:#f9f5ecb9;border:1px solid #dec9ac;border-radius:4px;color:#69543b;font-size:clamp(8px,.9vw,11px);font-weight:840;letter-spacing:.13em;padding:3px 7px}.px-g-drawer{background:linear-gradient(#9d6b4c,#674532);border:6px solid #593b2e;border-radius:4px;transform:perspective(250px) rotateX(15deg)}.px-g-drawer:before{content:"";position:absolute;inset:25% 7% 18%;border:3px solid #3c2c29;background:#ad7e58;box-shadow:0 5px #3f2b24}.px-g-drawer:after{content:"";position:absolute;left:48%;top:53%;width:12px;height:4px;background:#edd6ad;transform:translateX(-50%);border-radius:4px}.px-g-organizer{background:linear-gradient(110deg,#4a7773,#274d4b);border:7px solid #1b4a46;border-radius:5px;transform:perspective(240px) rotateX(24deg)}.px-g-organizer:after{content:"";position:absolute;inset:21% 17%;border:4px solid #82a29b;background:#183e3d}.px-g-pouch{height:67%;width:62%;background:#7b4649;border:5px solid #66333b;border-radius:12px 12px 22px 22px;transform:rotate(-8deg)}.px-g-pouch:before{content:"";position:absolute;width:55%;height:45%;left:20%;top:-36%;border:9px solid #704146;border-radius:45% 45% 0 0;border-bottom:0}.px-g-pouch:after{content:"";position:absolute;inset:32% 18% auto;height:5px;background:#e1b088;border-radius:4px}.px-g-desk{background:#cda67b;border:4px solid #956b4d;border-radius:5px;transform:perspective(220px) rotateX(20deg)}.px-g-desk:after{content:"";position:absolute;left:12%;top:16%;width:58%;height:64%;background:#f5eddc;transform:rotate(-10deg);box-shadow:4px 4px 0 #ffffff77}.px-g-cup{height:70%;width:45%;background:linear-gradient(92deg,#819b97,#d3dcd1,#91ada7);border-radius:6px 6px 24px 24px;border:4px solid #78928b;transform:rotate(4deg)}.px-g-cup:before{content:"";position:absolute;left:-2%;right:-2%;height:10px;top:-3px;background:#33534e;border-radius:50%}.px-g-folder{height:70%;background:#395a7d;border:4px solid #304c68;border-radius:4px;transform:rotate(-8deg)}.px-g-folder:before{content:"";position:absolute;left:8%;top:-10%;width:42%;height:15%;background:#395a7d;border-radius:4px 4px 0 0}.px-g-folder:after{content:"";position:absolute;inset:15% 10%;border-top:3px solid #91b0c6;border-bottom:3px solid #91b0c6}.px-stage-items{position:absolute;inset:0;pointer-events:none;z-index:3}.px-token{position:absolute;width:74px;height:68px;display:flex;align-items:center;justify-content:center;transform:translate(-50%,-50%);filter:drop-shadow(3px 6px 5px #402c244e)}.px-token svg{width:100%;height:100%}.px-hand{position:absolute;top:45%;left:110%;width:28%;height:29%;z-index:5;pointer-events:none;transform:translate(-50%,-50%);opacity:0;filter:drop-shadow(6px 9px 8px #5b392a52)}.px-hand svg{display:block;width:100%;height:100%}.px-hand.flip{scale:-1 1}.px-hand-item{position:absolute;left:27%;top:23%;width:62px;height:60px;transform:rotate(-14deg)}.px-hand-item svg{height:100%;width:100%}.px-stage-veil{position:absolute;inset:0;background:#102c26d9;z-index:8;display:flex;align-items:center;justify-content:center;letter-spacing:.21em;color:white;font-size:clamp(13px,2vw,22px);font-weight:850;text-align:center}.px-question{background:#f6f8f3;border:1px solid #d7e4d6;border-radius:7px;margin-top:15px;padding:20px}.px-question-head{display:flex;justify-content:space-between;gap:10px;color:#638072;font-size:10px;font-weight:780;letter-spacing:.15em}.px-question h3{font-size:clamp(20px,2.5vw,30px);line-height:1.2;letter-spacing:-.04em;margin:16px 0 19px}.px-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.px-choice{display:flex;align-items:center;justify-content:flex-start;gap:12px;text-align:left;background:white;border:1px solid #d2ddd2;border-radius:6px;padding:14px 15px;color:#294437;font-weight:740;cursor:pointer;min-height:62px;transition:border .15s,background .15s}.px-choice:hover:not(:disabled),.px-choice:focus-visible{background:#e5f5e9;border-color:#279261}.px-choice:disabled{cursor:default}.px-choice.correct{border-color:#3eaa71;background:#dcf5e3}.px-choice.wrong{border-color:#d58675;background:#fff0ec}.px-choice-tag{font:780 12px ui-monospace,monospace;display:grid;place-items:center;background:#eef3ed;min-width:27px;height:27px;border-radius:4px;color:#477354}.px-question-feedback{min-height:24px;margin:14px 0 0;font-size:12px;font-weight:720;color:#36634c}.px-finish{text-align:center;padding:50px 0}.px-finish .px-eyebrow{justify-content:center}.px-results{display:flex;justify-content:center;gap:15px;margin:35px 0}.px-results>div{min-width:175px;display:flex;flex-direction:column;gap:8px;padding:20px;background:#fff;border:1px solid #d6e4d8;border-radius:7px}.px-results small{font-weight:780;font-size:10px;color:#658275;letter-spacing:.11em}.px-results strong{font:850 36px ui-monospace,Consolas,monospace;color:#1f7652}.px-finish>p{max-width:580px;margin:20px auto;color:#63796a}.px-finish .px-fine{margin:15px auto}
@media(max-width:850px){.px-intro{grid-template-columns:1fr;gap:35px;padding:30px 0}.px-preview{width:100%;max-width:610px;transform:none}.px-main{padding:22px}.px-stage-canvas{min-height:280px}.px-choices{grid-template-columns:repeat(2,minmax(0,1fr))}.px-top-right>span:nth-child(2){display:none}}
@media(max-width:540px){.px-top{height:60px;padding:0 13px}.px-main{padding:16px 12px}.px-brand{gap:7px}.px-brand strong{font-size:12px}.px-brand small{font-size:8px}.px-preview{display:none}.px-intro h1{font-size:clamp(41px,12vw,63px)}.px-intro{min-height:450px}.px-play-head h2{font-size:24px}.px-play-head p{font-size:12px}.px-studio{padding:6px}.px-stage-canvas{min-height:235px;aspect-ratio:1.4}.px-place{width:31%;height:27%}.px-place-graphic{max-height:80px}.px-place-label{font-size:7px;padding:2px 3px}.px-token{width:40px;height:38px}.px-hand-item{width:34px;height:31px}.px-studio-toolbar{font-size:9px}.px-toolbar-muted{display:none}.px-choices{grid-template-columns:1fr 1fr;gap:6px}.px-choice{font-size:12px;min-height:50px;padding:8px;gap:7px}.px-question{padding:12px}.px-question-head{font-size:9px}.px-results{flex-wrap:wrap;gap:8px}.px-results>div{min-width:120px;padding:12px}.px-results strong{font-size:26px}.px-footer span:last-child{display:none}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
