:root{font-family:Cormorant Garamond,"Noto Serif JP",Georgia,serif;line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}*,*:before,*:after{box-sizing:border-box}html,body,#root{margin:0;padding:0;width:100%;min-height:100vh}body{overscroll-behavior-y:none}button{font-family:inherit}.upload-page{min-height:100vh;min-height:100dvh;display:flex;justify-content:center;align-items:center;padding:24px 16px;background:radial-gradient(1200px 600px at 50% -10%,rgba(255,220,230,.55),transparent 60%),radial-gradient(900px 500px at 100% 100%,rgba(240,215,180,.45),transparent 60%),linear-gradient(180deg,#fdf6f0,#faeee4);color:#3a2a2a}.upload-card{width:100%;max-width:480px;background:#ffffffc7;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.6);border-radius:20px;padding:28px 24px;box-shadow:0 20px 60px #825a502e}.upload-header{text-align:center;margin-bottom:20px}.upload-eyebrow{margin:0;font-size:11px;letter-spacing:.25em;text-transform:uppercase;color:#b98a6a}.upload-title{font-size:26px;margin:6px 0 4px;font-weight:500;letter-spacing:.02em}.upload-subtitle{margin:0;font-size:14px;color:#7a6458}.upload-preview-wrap{margin-bottom:18px}.upload-preview{aspect-ratio:4 / 3;border-radius:14px;overflow:hidden;background:#fbf1e8;border:1px dashed #d8bda6;display:flex;align-items:center;justify-content:center;transition:transform .22s cubic-bezier(.2,.7,.3,1),opacity .22s ease;will-change:transform,opacity;user-select:none;-webkit-user-select:none}.upload-preview.is-selected{touch-action:none;cursor:grab;border-style:solid;border-color:#c9a784;box-shadow:0 10px 24px #b4825a2e}.upload-preview.is-dragging{transition:opacity .15s ease;cursor:grabbing}.upload-preview.is-exiting{animation:fly-up .45s cubic-bezier(.5,0,.75,.2) forwards;pointer-events:none}@keyframes fly-up{to{transform:translateY(-110vh);opacity:0}}.upload-preview img{width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}.upload-preview-placeholder{font-size:13px;color:#a58e80;text-align:center;padding:16px}.upload-selected-actions{display:flex;flex-direction:column;align-items:center;gap:10px;margin-bottom:14px}.upload-swipe-hint{display:flex;flex-direction:column;align-items:center;gap:4px;color:#a67b50;font-size:14px;letter-spacing:.15em}.upload-swipe-arrow{font-size:26px;line-height:1;animation:bounce-up 1.6s ease-in-out infinite}@keyframes bounce-up{0%,to{transform:translateY(0);opacity:.55}50%{transform:translateY(-8px);opacity:1}}.upload-btn-ghost{background:transparent;border-color:#d8bda6;color:#8a6c5a;padding:10px 18px;font-size:14px}.upload-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px}.upload-btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid #c9a784;border-radius:999px;padding:14px 16px;font-size:15px;font-weight:500;background:#fff;color:#7a5236;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease,background .15s ease}.upload-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 6px 16px #b98a6a40}.upload-btn:disabled{opacity:.5;cursor:not-allowed}.upload-btn-primary{background:linear-gradient(135deg,#c9a784,#a67b50);color:#fff;border-color:transparent}.upload-status{min-height:48px;text-align:center;font-size:14px}.upload-progress{width:100%;height:6px;background:#f3e4d4;border-radius:999px;overflow:hidden;margin-bottom:8px}.upload-progress-bar{height:100%;background:linear-gradient(90deg,#e7b891,#b9855b);transition:width .15s ease}.upload-ok{color:#3e7d4f;margin:0}.upload-err{color:#b84a3c;margin:0}.display-page{position:relative;width:100vw;height:100vh;min-height:100dvh;overflow:hidden;color:#4a3a36;font-family:Cormorant Garamond,"Noto Serif JP",Georgia,serif}.display-auth-page{min-height:100vh;min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:24px 16px;color:#3a2a2a;font-family:Cormorant Garamond,"Noto Serif JP",Georgia,serif;background:radial-gradient(1200px 600px at 50% -10%,rgba(255,220,230,.55),transparent 60%),radial-gradient(900px 500px at 100% 100%,rgba(240,215,180,.45),transparent 60%),linear-gradient(180deg,#fdf6f0,#faeee4)}.display-auth-card{width:100%;max-width:380px;background:#ffffffd1;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.6);border-radius:18px;padding:28px 26px;box-shadow:0 16px 40px #825a5029;display:flex;flex-direction:column;gap:10px}.display-auth-eyebrow{margin:0;font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:#b98a6a;text-align:center}.display-auth-title{margin:0 0 2px;font-size:22px;font-weight:500;letter-spacing:.04em;text-align:center}.display-auth-desc{margin:0 0 8px;font-size:13px;color:#7a6458;text-align:center}.display-auth-input{font:inherit;font-size:16px;padding:12px 14px;border-radius:10px;border:1px solid #d8bda6;background:#fff;color:#3a2a2a;outline:none;transition:border-color .15s ease,box-shadow .15s ease}.display-auth-input:focus{border-color:#b98a6a;box-shadow:0 0 0 3px #b98a6a2e}.display-auth-btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;border-radius:999px;padding:13px 16px;font-size:15px;font-weight:500;color:#fff;background:linear-gradient(135deg,#c9a784,#a67b50);cursor:pointer;transition:transform .15s ease,box-shadow .15s ease,opacity .15s ease}.display-auth-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 8px 18px #b98a6a4d}.display-auth-btn:disabled{opacity:.5;cursor:not-allowed}.display-auth-err{margin:2px 0 0;font-size:13px;color:#b84a3c;text-align:center}.display-bg{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;background:radial-gradient(1400px 700px at 20% -10%,rgba(255,222,232,.85),transparent 60%),radial-gradient(1200px 700px at 90% 110%,rgba(236,212,174,.85),transparent 60%),radial-gradient(1000px 600px at 50% 50%,rgba(255,240,225,.55),transparent 70%),linear-gradient(180deg,#fbf3ec,#f4e3d3 55%,#ecd4b8)}.display-bg:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-image:radial-gradient(circle at 10% 20%,rgba(255,255,255,.7) 1px,transparent 1.5px),radial-gradient(circle at 70% 80%,rgba(255,255,255,.6) 1px,transparent 1.5px),radial-gradient(circle at 40% 60%,rgba(255,255,255,.5) 1px,transparent 1.5px);background-size:260px 260px,310px 310px,420px 420px;opacity:.6;mix-blend-mode:screen;animation:shimmer 24s ease-in-out infinite alternate}@keyframes shimmer{0%{opacity:.35}to{opacity:.75}}.display-petals{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;pointer-events:none}.display-petals span{position:absolute;top:-10vh;left:calc((var(--i) * 5.5%) + 2%);width:10px;height:10px;background:radial-gradient(circle at 30% 30%,#ffe6ea,#eab8c1);border-radius:60% 40% 55% 45%/45% 55%;opacity:.55;animation:fall calc(18s + (var(--i) * 1.1s)) linear infinite;animation-delay:calc(var(--i) * -1.3s);filter:drop-shadow(0 2px 2px rgba(180,120,130,.12))}@keyframes fall{0%{transform:translate3d(0,-10vh,0) rotate(0)}50%{transform:translate3d(-20px,50vh,0) rotate(180deg)}to{transform:translate3d(10px,110vh,0) rotate(360deg)}}.display-header{position:absolute;top:24px;left:0;right:0;z-index:3;text-align:center;pointer-events:none;text-shadow:0 1px 1px rgba(255,255,255,.6)}.display-eyebrow{margin:0;font-size:12px;letter-spacing:.4em;text-transform:uppercase;color:#a67b50}.display-title{margin:4px 0 0;font-size:clamp(22px,3vw,36px);font-weight:400;letter-spacing:.05em;font-style:italic}.display-empty{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;text-align:center;color:#8a6c5a}.display-empty p{margin:0;font-size:clamp(20px,2.5vw,32px);letter-spacing:.05em}.display-empty-sub{font-size:clamp(13px,1.4vw,16px)!important;color:#b39079!important;letter-spacing:.2em!important}.display-stage{position:absolute;top:90px;right:0;bottom:40px;left:0;z-index:2;overflow:hidden}.flow-card{position:absolute;left:0;width:auto;max-width:70vw;transform:translate(100vw);border-radius:14px;overflow:hidden;box-shadow:0 6px 14px #78504626,0 18px 40px #7850462e;background:#fff;padding:6px;animation-name:flow;animation-timing-function:linear;animation-iteration-count:infinite;will-change:transform;transition:height .4s ease-out}.flow-card img{height:100%;width:auto;max-width:100%;display:block;border-radius:10px;object-fit:contain}@keyframes flow{0%{transform:translate(100vw)}to{transform:translate(calc(-100vw - 20px))}}
