@font-face{font-family:"Special Elite";src:url("./assets/fonts/SpecialElite-Regular.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Huiwen Mingchao UI";src:url("./assets/fonts/HuiwenMingchao-ui.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Huiwen Mingchao Common";src:url("./assets/fonts/HuiwenMingchao-common-trad.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Yomogi Handwriting";src:url("./assets/fonts/Yomogi-Regular-common.woff2") format("woff2");font-weight:400;font-display:swap}

:root{
  --ink:#211f1b;
  --ink-soft:#514b40;
  --paper:#f4ecdd;
  --paper-light:#fbf5e8;
  --paper-deep:#e8ddc8;
  --metal:#9b835f;
  --metal-dark:#5e5344;
  --charcoal:#292620;
  --screen:#f5ead2;
  --accent:#8c3428;
  --focus:#9d3226;
  --shadow:rgba(54,45,33,.23);
  --font-zh:"Huiwen Mingchao UI","Huiwen Mingchao Common","PMingLiU","MingLiU",serif;
  --font-mono:"Special Elite","Courier New",monospace;
}

*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth}
body{
  margin:0;
  min-width:320px;
  min-height:100vh;
  color:var(--ink);
  background:
    radial-gradient(circle at 12% 26%,rgba(177,139,82,.08) 0 1px,transparent 2px),
    radial-gradient(circle at 78% 72%,rgba(177,139,82,.06) 0 1px,transparent 2px),
    linear-gradient(90deg,rgba(109,86,53,.025) 1px,transparent 1px),
    #f5f0e5;
  background-size:34px 34px,47px 47px,7px 100%,auto;
  font-family:var(--font-zh);
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:20;
  pointer-events:none;
  opacity:.16;
  mix-blend-mode:multiply;
  background-image:repeating-linear-gradient(8deg,rgba(64,52,35,.06) 0 1px,transparent 1px 8px);
}
button,input,select{font:inherit}
button,a{touch-action:manipulation}
button{color:inherit}
button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible,summary:focus-visible{
  outline:3px solid var(--focus);
  outline-offset:3px;
}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:fixed;left:12px;top:8px;z-index:200;padding:10px 14px;background:#292620;color:#fff1d8;text-decoration:none;transform:translateY(-150%)}
.skip-link:focus{transform:translateY(0)}

.site-header{
  position:sticky;
  top:0;
  z-index:10;
  min-height:88px;
  padding:14px clamp(20px,4vw,62px);
  border-bottom:1px solid rgba(91,76,54,.17);
  display:grid;
  grid-template-columns:minmax(220px,1fr) auto;
  align-items:center;
  background:rgba(247,241,228,.88);
}
.brand{justify-self:start;color:var(--ink);display:grid;line-height:1}
.brand strong{font:400 clamp(24px,2.3vw,36px)/1.15 var(--font-zh);letter-spacing:.08em}
.brand span{margin-top:4px;font:14px/1 var(--font-mono);letter-spacing:.04em}
.experience{position:relative;min-height:100dvh;overflow:hidden}
.experience[data-step="result"]{min-height:calc(100dvh - 88px)}
.experience::before,.experience::after{
  content:"";
  position:absolute;
  width:290px;
  height:420px;
  opacity:.13;
  pointer-events:none;
  background:
    linear-gradient(145deg,transparent 45%,#9d875f 46% 47%,transparent 48%) 28px 98px/150px 92px no-repeat,
    linear-gradient(35deg,transparent 45%,#9d875f 46% 47%,transparent 48%) 116px 130px/150px 92px no-repeat,
    linear-gradient(90deg,transparent 48%,#9d875f 49% 51%,transparent 52%) 142px 26px/18px 166px no-repeat,
    linear-gradient(#9d875f,#9d875f) 108px 68px/86px 3px no-repeat;
}
.experience::before{left:2%;top:13%}
.experience::after{right:0;bottom:3%;transform:scale(.8) rotate(3deg)}
.scene-copy{position:absolute;inset:28px 3% auto;display:flex;justify-content:space-between;color:rgba(67,57,43,.28);font:11px var(--font-mono);letter-spacing:.2em}
.machine-stage{
  position:relative;
  width:min(1120px,100%);
  min-height:100dvh;
  margin:0 auto;
  padding:26px 24px 112px;
  display:grid;
  grid-template-rows:auto auto;
  gap:16px;
  place-items:start center;
  perspective:1400px;
}
.experience-brand{position:relative;z-index:2;margin:0;padding:0 28px 9px;color:#27231d;font:400 clamp(32px,4vw,48px)/1.15 var(--font-zh);letter-spacing:.16em;text-align:center;text-shadow:0 1px rgba(255,255,255,.72)}
.experience-brand::after{content:"";position:absolute;left:24%;right:24%;bottom:0;height:1px;background:linear-gradient(90deg,transparent,#8d7d64,transparent)}
.machine-shadow{position:absolute;left:50%;bottom:70px;width:500px;height:58px;transform:translateX(-50%);border-radius:50%;background:rgba(61,49,33,.2);filter:blur(18px)}
.ticket-machine{
  position:relative;
  width:500px;
  transform-origin:54% 41%;
  transition:transform 820ms cubic-bezier(.4,0,.2,1),filter 220ms ease;
  filter:drop-shadow(0 24px 30px rgba(64,52,37,.2));
}
.experience[data-step="home"] .ticket-machine:hover{transform:translateY(-2px);filter:drop-shadow(0 22px 28px rgba(64,52,37,.27))}
.experience:not([data-step="home"]):not([data-step="result"]) .ticket-machine{transform:scale(1.12) translateY(34px)}

.machine-sign{
  position:relative;
  min-height:92px;
  padding:22px 22px 18px;
  overflow:hidden;
  border:6px solid #37332c;
  border-bottom-width:8px;
  border-radius:20px 20px 10px 10px;
  text-align:center;
  background:linear-gradient(105deg,#eee1c6,#fbf2dc 48%,#e8d5b4);
  box-shadow:inset 0 0 0 2px #9b8c73,inset 0 0 30px rgba(128,96,50,.16),0 6px 0 #1c1a17,0 11px 18px rgba(57,45,30,.14);
}
.machine-sign h2{position:relative;margin:0;font:400 34px/1.15 var(--font-zh);letter-spacing:.14em}
.sign-landscape{position:absolute;inset:0;opacity:.22}
.sign-landscape::before,.sign-landscape::after{content:"";position:absolute;bottom:10px;width:170px;height:42px;border-top:2px solid #a98851;border-radius:50%}
.sign-landscape::before{left:-18px;transform:rotate(8deg)}
.sign-landscape::after{right:-18px;transform:rotate(-8deg)}
.sign-landscape i{position:absolute;bottom:11px;width:2px;background:#a98851}
.sign-landscape i:nth-child(1){right:48px;height:55px}.sign-landscape i:nth-child(2){right:40px;height:38px}.sign-landscape i:nth-child(3){left:54px;height:26px}

.machine-body{
  position:relative;
  margin-top:7px;
  padding:26px 28px 22px;
  border:2px solid #514b41;
  border-radius:16px 16px 28px 28px;
  background:
    linear-gradient(90deg,rgba(255,255,255,.28),transparent 12%,transparent 88%,rgba(91,69,39,.09)),
    linear-gradient(115deg,#eadcc1,#f4e8d1 45%,#dfccb0);
  box-shadow:inset 0 0 0 2px rgba(255,255,255,.35),inset 0 0 34px rgba(103,78,44,.14),0 5px 0 rgba(83,68,49,.28);
}
.machine-body::before{content:"";position:absolute;inset:13px;pointer-events:none;background:radial-gradient(circle at 0 0,#6f624f 0 2px,transparent 3px),radial-gradient(circle at 100% 0,#6f624f 0 2px,transparent 3px),radial-gradient(circle at 0 100%,#6f624f 0 2px,transparent 3px),radial-gradient(circle at 100% 100%,#6f624f 0 2px,transparent 3px);opacity:.52}
.machine-body::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:.13;background:repeating-linear-gradient(9deg,rgba(98,70,35,.16) 0 1px,transparent 1px 7px)}
.machine-body>*{position:relative;z-index:1}
.machine-console{display:grid;grid-template-columns:minmax(0,1fr) 91px;gap:8px;align-items:start}
.screen-bezel{
  position:relative;
  min-height:312px;
  padding:22px;
  border:8px solid #292722;
  border-radius:18px;
  background:linear-gradient(135deg,#161513,#3a3731 50%,#171614);
  box-shadow:inset 0 0 0 4px #0e0d0c,inset 0 0 22px #000,0 2px 0 #6d6353;
}
.machine-screen{
  position:relative;
  min-height:260px;
  background:
    linear-gradient(rgba(245,234,210,.78),rgba(245,234,210,.78)),
    radial-gradient(circle at 20% 30%,#b49b6b 0 1px,transparent 2px);
  background-size:auto,22px 22px;
  border:2px solid #151411;
  border-radius:8px;
  box-shadow:inset 0 0 22px rgba(126,91,43,.2),0 0 0 2px #6d665b;
  overflow:auto;
}
.screen-panel{min-height:256px;padding:18px;color:#2a261f}
.screen-home{padding:0}
.screen-start{width:100%;min-height:256px;padding:22px;border:0;background:transparent;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;cursor:pointer}
.screen-start strong{font:400 22px/1.3 var(--font-zh);letter-spacing:.06em}
.screen-start small{font:13px var(--font-zh);color:#685f50}
.screen-start:hover{background:rgba(255,250,232,.22)}
.ticket-symbol{position:relative;display:block;width:76px;height:42px;border:3px solid #625743;border-radius:6px;transform:rotate(-7deg)}
.ticket-symbol::before,.ticket-symbol::after{content:"";position:absolute;right:13px;width:3px;height:7px;background:#f0e3c8;border:1px solid #625743;border-width:0 1px}
.ticket-symbol::before{top:-3px}.ticket-symbol::after{bottom:-3px}
.ticket-symbol.large{width:92px;height:50px;margin-bottom:4px}
.screen-centered{min-height:220px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:8px}
.screen-centered h2,.screen-heading h2{margin:0;font:400 24px/1.2 var(--font-zh);letter-spacing:.08em}
.screen-centered p,.screen-heading p{margin:0;color:#645d50;font:13px var(--font-mono)}
.screen-primary{
  min-width:148px;
  min-height:44px;
  padding:10px 18px;
  border:1px solid #171512;
  border-radius:5px;
  background:#2b2822;
  color:#fbf0da;
  box-shadow:inset 0 1px rgba(255,255,255,.14),0 3px 0 #161411;
  cursor:pointer;
}
.screen-primary:hover{background:#3a342a}.screen-primary:active{transform:translateY(2px);box-shadow:inset 0 1px rgba(255,255,255,.14),0 1px 0 #161411}
.screen-link{min-height:44px;padding:8px 10px;border:0;background:transparent;text-decoration:underline;text-underline-offset:3px;cursor:pointer;color:#51493d}
.screen-heading{display:flex;align-items:start;justify-content:space-between;gap:10px;padding-bottom:10px;border-bottom:1px solid rgba(72,60,43,.32)}
.screen-heading h2{font-size:19px}.screen-heading p{font-size:10px;margin-top:2px}.screen-heading .screen-link{min-height:44px;padding:3px;font-size:12px}
.journey-panel{padding:13px}.journey-panel form{display:grid;gap:10px}
.journey-fields{display:grid;grid-template-columns:1fr 22px 1fr;gap:5px;align-items:end}.journey-field{display:grid;gap:7px}
.journey-fields label>span,.date-fieldset legend,.blessing-field>span{display:block;margin-bottom:4px;font-size:12px}
.journey-fields small,.date-fieldset small,.blessing-field small{font:9px var(--font-mono);color:#766d5d}
.route-arrow{display:grid;place-items:center;height:36px}
select,input{width:100%;min-width:0;height:44px;padding:5px 8px;border:1px solid #655b4c;border-radius:3px;background:#fff9eb;color:#211f1b;outline:none;font-size:13px}
.date-fieldset{margin:0;padding:0;border:0}.date-grid{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:5px}.date-grid select{font-family:var(--font-mono);font-size:11px;padding-inline:4px}
.custom-place-field{padding-top:7px;border-top:1px dotted rgba(123,108,84,.7)}.custom-place-field input{font-size:11px}.more-settings{padding:9px 0;border-top:1px dotted #7b6c54;border-bottom:1px dotted #7b6c54}.more-settings>h3{margin:0 0 8px;font-size:12px;font-weight:400}.settings-content{display:grid;gap:8px}
.style-picker h3{margin:0 0 5px;font-size:11px;font-weight:400}.style-options{display:grid;grid-template-columns:1fr 1fr;gap:5px}
.style-option{min-height:44px;padding:4px 6px;border:1px solid #8c806e;border-radius:3px;background:#f8efdc;display:flex;align-items:center;gap:5px;font-size:10px;cursor:pointer}
.style-option.active{border-color:#27231d;box-shadow:inset 0 0 0 1px #27231d}.style-swatch{width:22px;height:22px;border:1px solid #a89b85;flex:none}.doodle-swatch{background:#faf6e9 radial-gradient(circle,#b7b0a1 1px,transparent 1px);background-size:6px 6px}.fiber-swatch{background:#eee5d4 repeating-linear-gradient(12deg,transparent 0 4px,rgba(126,93,62,.25) 4px 5px)}
.blessing-field input{height:44px;font-size:11px}.next-button{width:100%;min-height:44px}

.paper-dialog,.site-dialog{padding:0;border:1px solid #514739;background:#f5e9d3;color:var(--ink);box-shadow:0 20px 70px rgba(26,22,17,.35)}
.paper-dialog{width:min(84%,260px);border-radius:4px}.paper-dialog::backdrop,.site-dialog::backdrop{background:rgba(28,25,20,.5)}
.paper-dialog form{padding:20px;text-align:center}.paper-dialog h2{margin:0 0 16px;padding-bottom:10px;border-bottom:1px solid #9c8e76;font:18px var(--font-zh)}
.confirm-route{font:21px var(--font-zh)}.paper-dialog time{display:block;margin:7px 0;font:16px var(--font-mono)}.paper-dialog p{margin:8px 0 2px;font-size:12px}.confirm-price{font:22px var(--font-mono)}
.dialog-actions{margin-top:18px;display:grid;grid-template-columns:1fr 1fr;gap:8px}.dialog-actions button{min-height:44px;border:1px solid #544a3b;border-radius:4px;background:#f9efdc;cursor:pointer}.dialog-actions button:last-child{background:#302c25;color:#fff3dc}

.payment-screen{display:grid;gap:14px}.payment-totals{margin:0;padding:4px 8px;border-top:1px solid #8d7c61;border-bottom:1px solid #8d7c61}.payment-totals div{display:flex;justify-content:space-between;align-items:center;min-height:43px}.payment-totals dt{font-size:14px}.payment-totals dd{margin:0;font:19px var(--font-mono)}.payment-totals .remaining{color:var(--accent);border-top:1px dotted #8d7c61}.payment-totals .remaining dd{font-size:24px}.payment-hint{margin:0;text-align:center;font-size:11px;color:#655b4d}
.printer-mark{width:72px;height:48px;border:3px solid #5c5141;border-radius:5px;position:relative}.printer-mark::before{content:"";position:absolute;left:10px;right:10px;top:10px;height:4px;background:#5c5141}.printer-mark span{position:absolute;left:16px;right:16px;bottom:-10px;height:26px;border:2px solid #5c5141;background:#f4e8d2}
.printing-dots{display:flex;gap:8px;margin-top:5px}.printing-dots i{width:8px;height:8px;border-radius:50%;background:#4a4236;animation:printing 900ms ease-in-out infinite}.printing-dots i:nth-child(2){animation-delay:150ms}.printing-dots i:nth-child(3){animation-delay:300ms}
.ticket-out-icon{width:74px;height:28px;border:3px solid #5b5141;position:relative}.ticket-out-icon::after{content:"";position:absolute;left:15px;right:15px;top:11px;height:30px;background:#f7ecd8;border:2px solid #5b5141;box-shadow:0 5px 0 rgba(71,60,44,.12)}
.complete-screen small{margin-top:10px;color:#746956;font-size:10px}

.hardware-stack{display:grid;gap:6px}.hardware-unit{position:relative;border:3px solid #23211d;border-radius:10px;background:linear-gradient(135deg,#4c4841,#1c1b18);box-shadow:inset 0 0 0 2px #686259,inset 0 1px rgba(255,255,255,.1),0 3px 0 #746a5a;color:#ece5d6}
.keypad{height:88px;padding:9px}.keypad-display{width:39px;height:11px;margin-bottom:6px;background:#8da1dc;border:1px solid #15151b;box-shadow:0 0 6px rgba(130,154,245,.65)}.keypad-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:2px}.keypad-grid i{height:7px;border:1px solid #a29a8c;border-radius:2px;background:#6b675f}
.banknote-unit{height:70px;padding:8px 6px;text-align:center}.banknote-unit span{display:inline-block;padding:1px 3px;border:1px solid #8f887c;font:7px var(--font-mono)}.banknote-unit i{display:block;height:16px;margin-top:7px;border:4px solid #111;background:#050505;box-shadow:inset 0 2px #555}
.coin-slot-unit{height:94px;padding:11px 5px 8px;text-align:center;transition:box-shadow 200ms ease}.coin-slot-unit>span{font-size:7px}.coin-dial{width:43px;height:43px;margin:7px auto 0;border:2px solid #b8ae9d;border-radius:50%;background:#c1b59f;box-shadow:inset 0 0 0 5px #282621}.coin-dial i{display:block;width:6px;height:31px;margin:4px auto;border-radius:3px;background:#151410}
.contactless-unit{height:95px;padding:11px 4px;text-align:center}.contactless-mark{width:52px;height:42px;margin:0 auto 4px;padding:10px 3px;border:1px solid #aaa39a;border-radius:5px;font:14px var(--font-mono);transform:rotate(180deg)}.contactless-unit span{display:block;font-size:6px}.contactless-unit small{display:block;margin-top:2px;font:5px var(--font-mono)}
.experience[data-step="payment"] .coin-slot-unit{box-shadow:inset 0 0 0 2px #a89576,0 0 0 3px #af382b,0 0 18px rgba(169,45,35,.72)}.coin-slot-unit.is-drop-target{box-shadow:inset 0 0 0 2px #e9d2a5,0 0 0 4px #af382b,0 0 26px rgba(175,56,43,.9)!important;transform:scale(1.04)}
.outlet-labels{margin:14px 6px 5px;display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px;text-align:center}.outlet-labels span{font-size:11px}.outlet-labels small{display:block;margin-top:2px;font:7px var(--font-mono);color:#625b50}
.outlets{display:grid;grid-template-columns:1.1fr 1.2fr 1fr;gap:22px;padding:0 10px}.outlet{position:relative;height:47px;border:5px solid #27241f;border-radius:8px;background:linear-gradient(#080807,#25231f);box-shadow:inset 0 8px 12px #020202,0 3px 0 #857965;overflow:visible}
button.outlet{width:100%;padding:0;cursor:default}.ticket-outlet:not(:disabled){cursor:pointer}.change-outlet{border-radius:4px 4px 0 0}.receipt-outlet{height:38px;margin-top:9px}.receipt-outlet::before{content:"";position:absolute;left:13px;right:13px;top:15px;height:4px;background:#756d60}
.ticket-stub{position:absolute;left:10%;right:10%;top:12px;height:118px;padding:8px 5px;border:1px solid #544c3f;background:#f6eddc;color:#211e19;display:grid;align-content:start;text-align:center;transform:translateY(-120px);opacity:0;transition:transform 980ms cubic-bezier(.2,.8,.2,1),opacity 150ms ease;box-shadow:0 6px 10px rgba(42,34,24,.25);font-family:var(--font-zh)}
.ticket-stub::after{content:"";position:absolute;inset:34px 4px 4px;border-top:1px dashed #827765;background:radial-gradient(circle,#c2b79f 1px,transparent 1px);background-size:9px 9px;opacity:.45}.ticket-stub>*{position:relative;z-index:1}.ticket-stub small{font-size:6px}.ticket-stub strong{margin-top:9px;font-size:8px;white-space:nowrap}
.experience[data-step="complete"] .ticket-stub{transform:translateY(0);opacity:1}
.machine-base{width:96%;height:83px;margin:-2px auto 0;border:2px solid #554d42;border-top:7px solid #4a4339;border-radius:0 0 24px 24px;background:linear-gradient(90deg,#756c61,#aea59a 16%,#7c746a 52%,#aaa197 84%,#665e54);box-shadow:inset 0 2px #d3ccc3,0 7px 14px rgba(54,45,34,.18);overflow:hidden}
.machine-base i{display:block;height:18px;border-bottom:2px solid rgba(58,52,45,.45);box-shadow:0 1px rgba(255,255,255,.24)}

.hardware-notes{position:absolute;inset:0;pointer-events:none;font-size:14px}.hardware-notes span{position:absolute;width:170px}.hardware-notes span::before{content:"";position:absolute;top:9px;height:1px;width:76px;background:#4a4338}.hardware-notes span::after{content:"";position:absolute;top:6px;width:7px;height:7px;border-radius:50%;background:#39342d}.hardware-notes small{display:block;margin-top:3px;font:10px var(--font-mono);color:#625b4e}.note-screen{left:74px;top:345px;text-align:right}.note-screen::before{right:-88px}.note-screen::after{right:-92px}.note-keypad{right:30px;top:278px}.note-keypad::before{left:-88px}.note-keypad::after{left:-92px}.note-banknote{right:18px;top:363px}.note-banknote::before{left:-88px}.note-banknote::after{left:-92px}.note-coin{right:18px;top:451px}.note-coin::before{left:-88px}.note-coin::after{left:-92px}.note-card{right:-3px;top:552px}.note-card::before{left:-88px}.note-card::after{left:-92px}
.experience:not([data-step="home"]) .hardware-notes{opacity:0;visibility:hidden}
.coin-controls{position:absolute;left:50%;bottom:20px;transform:translateX(-50%);z-index:5;display:grid;justify-items:center;gap:7px;padding:9px 16px;border:1px solid #88785e;border-radius:8px;background:rgba(244,235,216,.96);box-shadow:0 12px 28px var(--shadow)}.coin-guide{display:grid;gap:1px;margin:0;text-align:center;color:#514635;font-size:11px}.coin-guide strong{font-weight:400}.coin-guide span{font:9px var(--font-mono);color:#756653}.coin-options{display:flex;gap:12px}
.coin-controls button{width:74px;min-height:72px;padding:6px;border:1px solid #ad9b7e;border-radius:6px;background:#efe2c8;display:grid;place-items:center;gap:3px;cursor:grab;touch-action:none}.coin-controls button:hover{background:#e4d0aa;transform:translateY(-2px)}.coin-controls button:active{cursor:grabbing;transform:translateY(1px)}.coin-controls button:disabled{opacity:.45;cursor:not-allowed;transform:none}.coin-controls small{font-size:10px}.coin{display:grid;place-items:center;width:46px;height:46px;border:2px solid #8b8376;border-radius:50%;background:radial-gradient(circle at 32% 26%,#e4ded1,#9d9588 68%,#69635a);box-shadow:inset 0 0 0 3px #c7c0b4,0 2px 2px rgba(39,34,27,.27);font:18px var(--font-mono)}.coin-five{background:radial-gradient(circle at 32% 26%,#e8dcc2,#9d8f73 68%,#6d624d)}.dragging-coin{position:fixed;z-index:110;pointer-events:none;transform:scale(1.08);box-shadow:inset 0 0 0 3px #c7c0b4,0 9px 20px rgba(39,34,27,.32)}
.flying-coin{position:fixed;z-index:100;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 32% 26%,#e6dfd2,#8f877b 70%);border:2px solid #716a60;box-shadow:0 6px 16px rgba(0,0,0,.25);font:14px var(--font-mono);pointer-events:none}

.result-panel{position:relative;z-index:4;width:min(1060px,calc(100% - 40px));min-height:calc(100dvh - 88px);margin:0 auto;padding:48px 0 70px;grid-template-columns:minmax(300px,.8fr) minmax(340px,470px);gap:80px;align-items:center}
.result-panel:not([hidden]){display:grid}.machine-stage:has(+ .result-panel:not([hidden])){display:none}
.result-copy p{margin:0 0 18px;font:12px var(--font-mono);letter-spacing:.18em;color:#716653}.result-copy h2{margin:0;font:400 clamp(32px,5vw,54px)/1.28 var(--font-zh);letter-spacing:.06em}.result-copy>span{display:block;margin-top:20px;font-size:17px;color:#5e574c}.result-actions{margin-top:36px;display:grid;gap:10px;max-width:330px}.result-actions button{min-height:52px;padding:12px 18px;border-radius:5px;cursor:pointer}.result-primary{border:1px solid #171512;background:#292620;color:#fff1d8;box-shadow:0 4px 0 #171512}.result-primary:active{transform:translateY(2px);box-shadow:0 2px 0 #171512}.result-primary:disabled{opacity:.58;cursor:wait}.result-secondary{border:1px solid #5d5344;background:transparent}.save-status{min-height:22px;margin-top:12px!important;letter-spacing:0!important;font:13px var(--font-zh)!important;color:var(--accent)!important}.ticket-stage{width:100%;filter:drop-shadow(0 22px 30px rgba(49,40,28,.23));transform:rotate(1.2deg)}.ticket{display:block;width:100%;height:auto;background:#faf6e9}.ticket .title,.ticket .love,.ticket .zone,.ticket .station,.ticket .direction,.ticket .blessing,.ticket .qr-caption,.ticket .valid,.ticket .note{font-family:"Yomogi Handwriting",var(--font-zh);font-weight:400}.ticket[data-style="two"] .title,.ticket[data-style="two"] .love,.ticket[data-style="two"] .zone,.ticket[data-style="two"] .station,.ticket[data-style="two"] .direction,.ticket[data-style="two"] .blessing,.ticket[data-style="two"] .qr-caption,.ticket[data-style="two"] .valid,.ticket[data-style="two"] .note{font-family:"Huiwen Mingchao","PMingLiU",serif}.ticket .date,.ticket .local,.ticket .roman,.ticket .price{font-family:"Special Elite","Courier New",monospace;font-weight:400}
.title{font-size:40px;letter-spacing:4px}.date{font-size:65px;letter-spacing:5px}.love,.zone{font-size:39px}.local{font-size:30px}.roman{font-size:35px;letter-spacing:1px}.station{font-size:74px;letter-spacing:10px}.direction{font-size:35px}.blessing{font-size:36px;letter-spacing:4px}.qr-caption{font-size:21px}.price{font-size:46px}.valid{font-size:34px}.note{font-size:23px}

.site-dialog{width:min(440px,calc(100% - 32px));border-radius:6px}.site-dialog form{position:relative;padding:30px}.site-dialog h2{margin:0 0 10px;font:28px var(--font-zh)}.site-dialog p,.site-dialog li{line-height:1.65}.dialog-close{position:absolute;right:12px;top:10px;width:44px;height:44px;border:0;background:transparent;font-size:30px;cursor:pointer}.info-dialog ul{padding-left:22px}.info-dialog strong{color:var(--accent)}

@keyframes printing{0%,100%{opacity:.25;transform:translateY(0)}50%{opacity:1;transform:translateY(-3px)}}

@media(max-width:980px){
  .site-header{grid-template-columns:1fr auto}.ticket-machine{width:470px}.hardware-notes{display:none}.machine-stage{padding-top:20px}.experience:not([data-step="home"]):not([data-step="result"]) .ticket-machine{transform:scale(1.08) translateY(25px)}
}

@media(min-width:981px) and (max-height:950px){
  .experience[data-step="home"] .ticket-machine{transform:scale(.88);transform-origin:top center}
  .experience[data-step="home"] .ticket-machine:hover{transform:scale(.88) translateY(-2px)}
}

@media(max-width:620px){
  .site-header{min-height:72px;padding:10px 14px}.brand strong{font-size:23px}.brand span{font-size:10px}.experience{min-height:100dvh}.experience[data-step="result"]{min-height:calc(100dvh - 72px)}.scene-copy{display:none}
  .machine-stage{min-height:100dvh;padding:16px 10px 112px;align-items:start;gap:12px}.experience-brand{font-size:30px;padding-bottom:8px}.machine-shadow{bottom:80px;width:80%}.ticket-machine{width:min(430px,100%)}.machine-sign{min-height:78px;padding:18px 12px 14px;border-radius:16px 16px 8px 8px}.machine-sign h2{font-size:27px}.machine-body{padding:18px 18px 16px}.machine-console{grid-template-columns:minmax(0,1fr) 76px}.screen-bezel{min-height:285px;padding:15px}.machine-screen{min-height:251px}.screen-panel,.screen-start{min-height:247px}.hardware-unit{border-width:2px}.keypad{height:78px}.banknote-unit{height:61px}.coin-slot-unit{height:82px}.contactless-unit{height:83px}.outlets{gap:14px}.machine-base{height:70px}
  .experience:not([data-step="home"]):not([data-step="result"]) .ticket-machine{width:100%;transform:none;filter:none}.experience:not([data-step="home"]):not([data-step="result"]) .experience-brand,.experience:not([data-step="home"]):not([data-step="result"]) .machine-sign,.experience:not([data-step="home"]):not([data-step="result"]) .machine-base{display:none}.experience:not([data-step="home"]):not([data-step="result"]) .machine-stage{gap:0}.experience:not([data-step="home"]):not([data-step="result"]) .machine-body{margin-top:0;padding:8px;border:0;background:transparent;box-shadow:none}.experience:not([data-step="home"]):not([data-step="result"]) .machine-body::before,.experience:not([data-step="home"]):not([data-step="result"]) .machine-body::after{display:none}.experience:not([data-step="home"]):not([data-step="result"]) .machine-console{grid-template-columns:minmax(0,1fr)}.experience:not([data-step="home"]):not([data-step="result"]) .hardware-stack{display:none}.experience:not([data-step="home"]):not([data-step="result"]) .screen-bezel{min-height:calc(100dvh - 222px);padding:14px;border-width:8px}.experience:not([data-step="home"]):not([data-step="result"]) .machine-screen,.experience:not([data-step="home"]):not([data-step="result"]) .screen-panel{min-height:calc(100dvh - 266px)}.experience:not([data-step="home"]):not([data-step="result"]) .screen-centered{min-height:calc(100dvh - 302px)}.experience:not([data-step="complete"]) .outlet-labels,.experience:not([data-step="complete"]) .outlets{display:none}.experience[data-step="complete"] .outlet-labels{margin-top:12px}.experience[data-step="complete"] .outlets{max-width:300px;margin:0 auto}.experience[data-step="complete"] .outlets>*:not(:first-child),.experience[data-step="complete"] .outlet-labels>*:not(:first-child){visibility:hidden}
  .experience:is([data-step="payment"],[data-step="printing"],[data-step="complete"]) .machine-stage{padding-bottom:148px!important;gap:12px!important}.experience:is([data-step="payment"],[data-step="printing"],[data-step="complete"]) .ticket-machine{width:min(430px,100%)!important;transform:scale(.92)!important;transform-origin:top center;filter:drop-shadow(0 18px 25px rgba(64,52,37,.2))!important}.experience:is([data-step="payment"],[data-step="printing"],[data-step="complete"]) .experience-brand,.experience:is([data-step="payment"],[data-step="printing"],[data-step="complete"]) .machine-sign,.experience:is([data-step="payment"],[data-step="printing"],[data-step="complete"]) .machine-base{display:block!important}.experience:is([data-step="payment"],[data-step="printing"],[data-step="complete"]) .machine-body{margin-top:7px!important;padding:18px 18px 16px!important;border:2px solid #514b41!important;background:linear-gradient(115deg,#eadcc1,#f4e8d1 45%,#dfccb0)!important;box-shadow:inset 0 0 0 2px rgba(255,255,255,.35),inset 0 0 34px rgba(103,78,44,.14),0 5px 0 rgba(83,68,49,.28)!important}.experience:is([data-step="payment"],[data-step="printing"],[data-step="complete"]) .machine-body::before,.experience:is([data-step="payment"],[data-step="printing"],[data-step="complete"]) .machine-body::after{display:block!important}.experience:is([data-step="payment"],[data-step="printing"],[data-step="complete"]) .machine-console{grid-template-columns:minmax(0,1fr) 76px!important}.experience:is([data-step="payment"],[data-step="printing"],[data-step="complete"]) .hardware-stack{display:grid!important}.experience:is([data-step="payment"],[data-step="printing"],[data-step="complete"]) .screen-bezel{min-height:285px!important;padding:15px!important;border-width:8px!important}.experience:is([data-step="payment"],[data-step="printing"],[data-step="complete"]) .machine-screen,.experience:is([data-step="payment"],[data-step="printing"],[data-step="complete"]) .screen-panel,.experience:is([data-step="payment"],[data-step="printing"],[data-step="complete"]) .screen-centered{min-height:251px!important;height:auto!important}.experience:is([data-step="payment"],[data-step="printing"],[data-step="complete"]) .outlet-labels,.experience:is([data-step="payment"],[data-step="printing"],[data-step="complete"]) .outlets{display:grid!important}.experience:is([data-step="payment"],[data-step="printing"],[data-step="complete"]) .outlet-labels{margin-top:12px!important}.experience:is([data-step="payment"],[data-step="printing"],[data-step="complete"]) .outlets{max-width:none!important;margin:0!important}.experience:is([data-step="payment"],[data-step="printing"],[data-step="complete"]) .outlets>*:not(:first-child),.experience:is([data-step="payment"],[data-step="printing"],[data-step="complete"]) .outlet-labels>*:not(:first-child){visibility:visible!important}
  .coin-controls{bottom:14px;width:calc(100% - 20px);justify-content:center}.coin-controls button{width:min(26vw,78px)}
  .result-panel{width:min(100% - 24px,520px);min-height:calc(100dvh - 72px);padding:28px 0 50px;grid-template-columns:1fr;gap:32px}.result-copy{text-align:center}.result-actions{margin-inline:auto}.result-copy h2{font-size:36px}.ticket-stage{width:min(100%,390px);margin:0 auto;transform:none}
}

@media(max-width:410px){
  .brand strong{font-size:20px}.brand span{font-size:9px}.ticket-machine{width:100%}.machine-body{padding:14px 11px 12px}.machine-console{grid-template-columns:minmax(0,1fr) 68px}.screen-bezel{padding:12px}.screen-start strong{font-size:18px}.outlets{gap:9px;padding:0 3px}.outlet-labels{gap:5px}.journey-fields{grid-template-columns:1fr 15px 1fr}.journey-panel{padding:10px}.screen-heading h2{font-size:17px}.date-grid select{font-size:9px}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}.ticket-machine{transform:none!important}.coin-controls button:hover{transform:none}
}