@import "https://fonts.googleapis.com/css2?family=Chonburi&display=swap";:root{--red-deep:#5c0f1a;--red:#7c141f;--red-bright:#9e2130;--red-light:#c33e46;--gold:#d3a54a;--gold-bright:#f2d488;--gold-dark:#8a6a26;--ivory:#f7ecd1;--ink:#2a130a;--shadow:#0a02028c;--font-display:"Chonburi", "IBM Plex Sans Thai", serif;--font-body:"IBM Plex Sans Thai", sans-serif;--gutter:1.1rem;--radius:16px}*,:before,:after{box-sizing:border-box}html,body{width:100%;overflow-x:hidden}body{min-height:100vh;font-family:var(--font-body);color:var(--ivory);background:radial-gradient(ellipse at 50% -10%, var(--red-light) 0%, transparent 55%), linear-gradient(180deg, var(--red) 0%, var(--red-deep) 65%, #3d0a12 100%);margin:0;position:relative}body:before{content:"";pointer-events:none;opacity:.07;background-image:repeating-linear-gradient(45deg, var(--gold) 0 1px, transparent 1px 26px), repeating-linear-gradient(-45deg, var(--gold) 0 1px, transparent 1px 26px);z-index:0;position:fixed;inset:0}h1,h2,p,ul,input{margin:0}button{font-family:var(--font-body);cursor:pointer}img,svg{max-width:100%}#app{z-index:1;flex-direction:column;min-height:100vh;display:flex;position:relative}#app-header{padding:.9rem var(--gutter);border-bottom:1px solid #d3a54a59;justify-content:space-between;align-items:center;display:flex}#app-title{font-family:var(--font-display);letter-spacing:.05em;background:linear-gradient(180deg, var(--gold-bright), var(--gold));color:#0000;text-shadow:0 1px #00000040;-webkit-background-clip:text;background-clip:text;font-size:1.5rem}#btn-sound{color:var(--gold-bright);background:#0003;border:1px solid #d3a54a80;border-radius:999px;padding:.4rem .9rem;font-size:.8rem}#btn-sound:hover{background:#00000052}#btn-sound[aria-pressed=true]{border-color:var(--gold-bright);color:var(--ivory);background:var(--gold-dark)}main{padding:var(--gutter);flex-direction:column;flex:1;gap:1.25rem;display:flex}.hidden{display:none!important}#btn-start,#btn-draw-instant,#btn-mash,#btn-share,#btn-again,#btn-disclaimer-ok{border:none;border-radius:12px;width:100%;padding:.95rem 1.4rem;font-size:1rem;font-weight:600;transition:transform .12s,filter .12s,box-shadow .12s;display:block}#btn-start:active,#btn-draw-instant:active,#btn-mash:active,#btn-share:active,#btn-again:active,#btn-disclaimer-ok:active{transform:translateY(1px)}#btn-start,#btn-draw-instant{background:linear-gradient(180deg, var(--gold-bright), var(--gold) 70%, var(--gold-dark));color:var(--ink);box-shadow:0 6px 16px var(--shadow), inset 0 1px 0 #fff6}#btn-start:hover,#btn-draw-instant:hover{filter:brightness(1.06)}#btn-draw-instant{box-shadow:0 0 0 3px #f2d48840, 0 6px 16px var(--shadow), inset 0 1px 0 #fff6}#btn-mash,#btn-share,#btn-again,#btn-disclaimer-ok{color:var(--gold-bright);background:#00000038;border:1px solid #d3a54a8c}#btn-mash:hover,#btn-share:hover,#btn-again:hover,#btn-disclaimer-ok:hover{border-color:var(--gold-bright);background:#00000057}#disclaimer{border-radius:var(--radius);background:#00000040;border:1px solid #d3a54a80;flex-direction:column;gap:.75rem;padding:1rem;display:flex}#disclaimer p{color:var(--ivory);opacity:.9;font-size:.85rem;line-height:1.6}#screen-intention{flex-direction:column;flex:1;justify-content:center;gap:1.25rem;width:100%;max-width:32rem;margin-inline:auto;display:flex}#screen-intention label{color:var(--gold-bright);font-size:.9rem}#intention-input{width:100%;font-family:var(--font-body);color:var(--ivory);background:#00000047;border:1px solid #d3a54a73;border-radius:10px;margin-top:.5rem;padding:.85rem 1rem;font-size:1rem;display:block}#intention-input:focus{border-color:var(--gold-bright);outline:none;box-shadow:0 0 0 3px #f2d48833}#intention-input::placeholder{color:#f7ecd173}#screen-shake{text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:1.5rem;display:flex}#shake-motion,#shake-fallback,#shake-instant{flex-direction:column;align-items:center;gap:1.25rem;width:100%;max-width:28rem;display:flex}#shake-motion p,#fallback-hint{color:#f7ecd1d9;font-size:.95rem;line-height:1.7}#cylinder{--energy:0;width:150px;height:190px;margin-inline:auto;position:relative}#cylinder:before{content:"";background:repeating-linear-gradient(90deg, #0000001f 0 3px, transparent 3px 16px), linear-gradient(180deg, var(--red-light) 0%, var(--red) 55%, var(--red-deep) 100%);width:118px;height:150px;box-shadow:0 10px 24px var(--shadow), inset 0 3px 0 #ffffff26;border:2px solid var(--gold-dark);border-radius:14px 14px 22px 22px;position:absolute;bottom:0;left:50%;transform:translate(-50%)}#cylinder:after{content:"";background:linear-gradient(180deg, var(--gold-bright), var(--gold-dark));width:122px;height:14px;box-shadow:0 2px 6px var(--shadow);border-radius:50%;position:absolute;bottom:148px;left:50%;transform:translate(-50%)}.stick{background:linear-gradient(180deg, var(--gold-bright) 0%, var(--gold) 45%, #b98a2e 100%);transform-origin:bottom;--spread:calc((var(--i) - 3) * 9deg);--sign:1;width:8px;height:130px;transform:translateX(calc((var(--i) - 3) * 11px)) rotate(calc(var(--spread) + var(--sign) * var(--energy) * 16deg));z-index:2;border-radius:4px;transition:transform 70ms ease-out;position:absolute;bottom:60px;left:50%;box-shadow:inset -1px 0 #0003}.stick:nth-child(odd){--sign:-1}#cylinder.cylinder--emit .stick:nth-child(4){z-index:3;animation:.6s cubic-bezier(.2,.7,.3,1) forwards stick-emit}@keyframes stick-emit{0%{transform:translate(0)translateY(0)rotate(0)}55%{transform:translate(-4px)translateY(-92px)rotate(-8deg)}to{opacity:0;transform:translate(-4px)translateY(-150px)rotate(-14deg)}}#screen-slip{flex-direction:column;flex:1;align-items:center;gap:1.25rem;width:100%;display:flex}#slip{background:linear-gradient(180deg, var(--ivory), #efe0ba);width:100%;max-width:26rem;color:var(--ink);border-radius:var(--radius);border:3px double var(--gold-dark);box-shadow:0 16px 40px var(--shadow);padding:1.75rem 1.5rem;animation:.42s ease-out slip-appear;position:relative}@keyframes slip-appear{0%{opacity:0;transform:translateY(14px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}#slip:before{content:"签";width:34px;height:34px;font-family:var(--font-display);color:var(--ivory);background:radial-gradient(circle at 35% 30%, var(--red-light), var(--red-deep));border:2px solid var(--gold-bright);border-radius:50%;place-items:center;font-size:1.05rem;display:grid;position:absolute;top:-14px;right:18px;transform:rotate(8deg);box-shadow:0 4px 10px #00000059}.slip-no{font-family:var(--font-display);text-align:center;color:var(--red);border-bottom:1px solid var(--gold-dark);margin-bottom:.75rem;padding-bottom:.75rem;font-size:1.15rem}.slip-no:before,.slip-no:after{content:"◆";color:var(--gold-dark);vertical-align:middle;margin:0 .5rem;font-size:.6rem}.slip-verse{font-family:var(--font-display);text-align:center;color:var(--red-deep);border-bottom:1px dashed var(--gold-dark);margin-bottom:.75rem;padding:.25rem .5rem 1rem;font-size:1.05rem;line-height:2.1}#slip p:not(.slip-no):not(.slip-verse){border-bottom:1px solid #8a6a2640;padding:.4rem 0;font-size:.92rem;line-height:1.65}#slip p:not(.slip-no):not(.slip-verse):last-child{border-bottom:none}#slip p:not(.slip-no):not(.slip-verse) strong{min-width:4.6rem;color:var(--red);font-weight:700;display:inline-block}#again-note{color:var(--gold-bright);border-left:3px solid var(--gold-bright);background:#00000040;border-radius:4px;width:100%;max-width:26rem;padding:.6rem .9rem;font-size:.85rem}#screen-slip>button{max-width:26rem}#app-footer{text-align:center;padding:.9rem var(--gutter) 1.4rem}#app-footer p{color:#f7ecd18c;font-size:.72rem}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}}@media (width>=900px){body:after{content:"";pointer-events:none;z-index:2;background:linear-gradient(90deg, var(--red-deep) 0, transparent 64px, transparent calc(100% - 64px), var(--red-deep) 100%), repeating-linear-gradient(180deg, #d3a54a29 0 2px, transparent 2px 34px);background-blend-mode:normal;position:fixed;inset:0;-webkit-mask-image:linear-gradient(90deg,#000 0 64px,#0000 64px calc(100% - 64px),#000 calc(100% - 64px) 100%);mask-image:linear-gradient(90deg,#000 0 64px,#0000 64px calc(100% - 64px),#000 calc(100% - 64px) 100%)}main{padding:2.5rem 3rem 3rem}#app-header{padding:1.25rem 4rem}#app-title{font-size:1.9rem}#screen-intention{max-width:26rem}#btn-start,#btn-draw-instant,#btn-mash,#btn-disclaimer-ok{width:auto;min-width:14rem;margin-inline:auto;padding:.9rem 2.4rem}#cylinder{width:210px;height:260px;transform:scale(1.05)}#cylinder:before{width:160px;height:200px}#cylinder:after{width:166px;bottom:198px}.stick{height:175px;bottom:82px}#shake-motion p,#fallback-hint{max-width:26rem;font-size:1.05rem}#slip{max-width:30rem;padding:2.5rem 2.75rem}.slip-verse{font-size:1.15rem}#screen-slip{grid-template-columns:repeat(2,minmax(0,12rem));justify-content:center;align-items:start;gap:1rem;display:grid}#slip,#again-note{grid-column:1/-1;justify-self:center}#btn-share,#btn-again{width:auto}}