@import url('./fonts.css');
:root{--green:#10c773;--pink:#df246b;--yellow:#ffeb38;--orange:#ff791f;--ink:#292929;--paper:#fffef7;font-family:Arial,Helvetica,sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none}
*{box-sizing:border-box}body{margin:0}button,input,a{ -webkit-tap-highlight-color:transparent}button,input{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer;border:2px solid var(--ink);border-radius:14px;padding:15px 20px;min-height:50px;font-weight:700;background:white;color:var(--ink);transition:transform .15s,box-shadow .15s}button:hover{transform:translateY(-2px);box-shadow:3px 3px 0 var(--ink)}button:active{transform:translateY(1px);box-shadow:none}button:disabled{opacity:.55;cursor:wait;transform:none;box-shadow:none}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid var(--pink);outline-offset:4px}a{color:inherit;text-underline-offset:4px}p{line-height:1.55}h1,h2,p{margin-top:0}h1{font-size:clamp(36px,8vw,64px);line-height:1.03;letter-spacing:-.05em}h2{font-size:24px;letter-spacing:-.025em}[hidden]{display:none!important}.eyebrow{text-transform:uppercase;font-size:11px;letter-spacing:.16em;font-weight:800}.muted,.note{color:#5b5b5b;font-size:14px}.note{line-height:1.5}.primary{background:var(--green);box-shadow:4px 4px 0 var(--ink)}.pink{background:var(--pink);color:white}.yellow{background:var(--yellow)}.text-button{border:0;background:transparent;padding:8px;min-height:44px;font-size:13px;text-decoration:underline;box-shadow:none!important}.pill{display:inline-flex;align-items:center;gap:7px;background:#fff;border:1px solid #ddd9c9;border-radius:99px;padding:8px 12px;font-size:11px;font-weight:700;letter-spacing:.03em}.dot{width:7px;height:7px;background:var(--green);border-radius:50%}.logo{width:165px;height:auto}
.shell{width:min(100%,1100px);margin:auto;padding:24px max(24px,env(safe-area-inset-right)) 155px max(24px,env(safe-area-inset-left))}.topbar{display:flex;justify-content:space-between;align-items:center;gap:15px;padding-bottom:35px}.hero{display:grid;grid-template-columns:1fr 1fr;gap:55px;align-items:center;min-height:62vh}.hero-copy{max-width:510px}.hero h1{margin:17px 0 22px}.marker{display:inline-block;position:relative;padding:0 5px;background:var(--yellow);transform:rotate(-2deg)}.intro{font-size:17px;max-width:420px}.actions{display:grid;gap:13px;margin:27px 0 18px}.action{display:flex;text-align:left;justify-content:space-between;align-items:center;gap:12px;padding:17px 20px}.action strong{font-size:21px;display:block}.action small{display:block;font-size:12px;font-weight:400;margin-top:4px}.action .arrow{font-size:27px}.privacy{display:flex;gap:10px;align-items:flex-start;font-size:12px;color:#62625b;line-height:1.5}.artboard{position:relative;aspect-ratio:1/1.12;max-height:530px;border:2px solid var(--ink);border-radius:150px 150px 22px 22px;background:#e4f8e9;display:grid;place-items:center;overflow:hidden;box-shadow:9px 9px 0 var(--ink)}.artboard:before{content:"";position:absolute;width:400px;height:400px;border:1px solid #b3dfbd;border-radius:50%;top:50%;left:50%;transform:translate(-50%,-50%)}.artboard:after{content:"";position:absolute;width:290px;height:290px;border:1px solid #b3dfbd;border-radius:50%;top:50%;left:50%;transform:translate(-50%,-50%)}.portrait{width:90%;z-index:1}.art-label{position:absolute;bottom:29px;left:24px;right:24px;background:var(--pink);color:white;text-align:center;font-weight:800;font-size:clamp(22px,3.2vw,35px);padding:12px;transform:rotate(-4deg);z-index:2}.sticker{position:absolute;width:72px;top:40px;right:17px;transform:rotate(12deg);z-index:2}.art-tag{position:absolute;top:35px;left:25px;z-index:2;font-size:11px;font-weight:700;border:1px solid var(--ink);padding:8px 12px;border-radius:99px;background:white;transform:rotate(-7deg)}.values{display:flex;gap:20px;justify-content:center;flex-wrap:wrap;margin-top:48px;border-top:1px solid #ddd9c9;padding-top:22px;font-size:12px}.values span:before{content:"✦";margin-right:8px;color:var(--pink)}
.sync-bar{position:fixed;z-index:20;bottom:0;left:0;right:0;background:rgba(255,254,247,.97);border-top:1px solid #d6d5ca;padding:12px max(20px,env(safe-area-inset-right)) calc(12px + env(safe-area-inset-bottom));display:flex;gap:12px;justify-content:center;align-items:center;flex-wrap:wrap}.sync-copy{max-width:600px;font-size:12px;line-height:1.4}.sync-copy strong{display:block;font-size:12px}.sync-copy small{display:block;color:#666;margin-top:3px}.sync-bar button{font-size:12px;min-height:42px;padding:9px 12px;border-radius:10px}.error{border-left:4px solid var(--pink);background:#fff0f5;padding:13px;font-size:14px;line-height:1.5;margin:18px 0}
.hall{position:fixed;inset:0;overflow:hidden;background:var(--green);display:flex;flex-direction:column;justify-content:center;align-items:center;padding:70px 20px 150px;color:var(--ink);isolation:isolate}.hall:before,.hall:after{content:"";position:absolute;width:120vmax;height:120vmax;border-radius:42%;z-index:-1;opacity:.75;animation:drift 18s ease-in-out infinite alternate}.hall:before{background:var(--yellow);top:30%;left:-40%}.hall:after{background:var(--pink);bottom:50%;left:45%;animation-delay:-9s;opacity:.9}.hall .eyebrow{background:var(--paper);padding:10px 16px;border:2px solid var(--ink);border-radius:99px;transform:rotate(-4deg)}.hall h1{font-size:clamp(72px,23vw,240px);font-weight:900;letter-spacing:-.065em;line-height:1;margin:10px 0 15px}.hall-brand{font-weight:900;font-size:clamp(22px,5vw,40px)}.hall-tools{position:absolute;left:16px;right:16px;top:max(16px,env(safe-area-inset-top));display:flex;justify-content:space-between;gap:12px}.hall-tools button{font-size:13px;background:rgba(255,255,255,.9)}.hall-note{font-size:12px;text-align:center;max-width:350px;margin:20px 0 0;background:rgba(255,255,255,.8);border-radius:10px;padding:10px}.hall .star{width:80px;animation:float 5s ease-in-out infinite}
.ar-view{position:fixed;inset:0;background:#1b2220;color:white}.ar-frame{border:0;width:100%;height:100%;position:absolute;inset:0}.ar-tools{position:absolute;top:max(16px,env(safe-area-inset-top));left:16px;right:16px;display:flex;justify-content:space-between;gap:12px;z-index:3}.ar-tools button{font-size:13px;background:#fffef7;min-height:46px;padding:12px}.ar-status{position:absolute;z-index:3;left:20px;right:20px;bottom:145px;background:rgba(17,30,24,.85);padding:14px;border-radius:14px;font-size:14px;text-align:center}.spinner{display:inline-block;width:15px;height:15px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin 1s linear infinite;margin-right:8px;vertical-align:-2px}
.utility{max-width:760px;margin:auto;padding:28px 22px 60px}.utility .topbar{padding-bottom:36px}.utility h1{font-size:clamp(35px,7vw,50px);margin-bottom:18px}.panel{border:2px solid var(--ink);background:white;border-radius:18px;padding:24px;margin:24px 0;box-shadow:5px 5px 0 #e5e4d6}.panel h2{margin-bottom:16px}.field{display:block;font-size:13px;font-weight:700;margin:15px 0 8px}input{width:100%;border:2px solid #85857d;border-radius:11px;padding:14px;background:white;color:var(--ink);font-size:16px;min-width:0}.row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.row>*{flex:1}.control-buttons{display:grid;gap:14px}.control-buttons button{text-align:left;padding:21px}.control-buttons strong{display:block;font-size:19px}.control-buttons small{display:block;margin-top:7px;font-weight:400;font-size:13px;line-height:1.4}.state-card{background:#f1f8ef;border-radius:12px;padding:17px;font-size:14px;line-height:1.6;margin-top:20px}.state-card time{display:block;font-size:12px;color:#555}.status-msg{min-height:24px;font-size:14px;line-height:1.5;margin-top:15px}.qr-output{background:white;padding:24px;width:max-content;max-width:100%;margin:25px auto;border:1px solid #ddd}.qr-output canvas,.qr-output img{max-width:100%;height:auto;display:block}.break{overflow-wrap:anywhere}.guide{max-width:850px}.guide h2{margin-top:40px}.guide li{line-height:1.65;margin-bottom:13px}.guide code{background:#eef0e8;padding:2px 5px;border-radius:4px;overflow-wrap:anywhere}.guide table{border-collapse:collapse;width:100%;font-size:14px}.guide td,.guide th{padding:10px;border:1px solid #ccc;text-align:left}.guide pre{white-space:pre-wrap;overflow-wrap:anywhere;background:#eef0e8;padding:15px}.guide img{max-width:100%}
@keyframes spin{to{transform:rotate(360deg)}}@keyframes drift{to{transform:translate(10%,5%) rotate(45deg)}}@keyframes float{50%{transform:translateY(-12px) rotate(10deg)}}
@media(max-width:700px){.shell{padding:20px 22px 170px}.topbar{padding-bottom:22px}.topbar .pill{font-size:10px;padding:8px}.logo{width:135px}.hero{grid-template-columns:1fr;gap:25px;min-height:auto}.hero-copy{max-width:none}.hero h1{font-size:49px;margin:15px 0}.intro{font-size:15px;margin-bottom:0}.actions{margin:24px 0 17px}.artboard{aspect-ratio:1.4;height:auto;border-radius:100px 100px 18px 18px;max-width:430px;width:100%;margin:auto}.portrait{width:65%;margin-top:15px}.art-label{font-size:22px;bottom:17px}.sticker{width:55px;top:27px}.values{margin-top:30px;gap:12px;font-size:10px}.sync-bar{justify-content:space-between;gap:6px;padding:10px 16px calc(10px + env(safe-area-inset-bottom))}.sync-copy{flex:1;min-width:180px}.sync-copy small{font-size:10px}.panel{padding:19px}.row>*{flex-basis:100%}.hall h1{font-size:25vw}.utility .topbar{padding-bottom:25px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}