:root{--primary-color: #9b8bb4;--secondary-color: #7b6b94;--accent-color: #9b8bb4;--text-primary: #ffffff;--text-secondary: #e0e0e0;--text-dark: #4a4358;--bg-overlay: rgba(0, 0, 0, .8);--bg-glass: rgba(255, 255, 255, .1);--bg-modal: rgba(0, 0, 0, .9);--gradient-primary: linear-gradient(135deg, #eeeaf4 0%, #e4e0ed 100%);--gradient-secondary: linear-gradient(45deg, #9b8bb4, #b8a5d4);--gradient-accent: linear-gradient(45deg, #9b8bb4, #b8a5d4);--gradient-glass: linear-gradient(135deg, rgba(255,255,255,.1), rgba(255,255,255,.05));--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--spacing-xxl: 3rem;--font-main: "Noto Sans JP", sans-serif;--font-accent: "Orbitron", monospace;--font-size-xs: .75rem;--font-size-sm: .875rem;--font-size-md: 1rem;--font-size-lg: 1.25rem;--font-size-xl: 1.5rem;--font-size-xxl: 2rem;--transition-fast: .2s ease;--transition-normal: .3s ease;--transition-slow: .5s ease;--animation-bounce: cubic-bezier(.25, 1, .5, 1);--z-background: 1;--z-character: 10;--z-ui: 20;--z-modal: 30;--z-loading: 40;--z-controller: 150}*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;font-family:var(--font-main);font-size:var(--font-size-md);color:var(--text-primary);background:var(--gradient-primary);user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}body{position:relative}.loading-screen{position:fixed;top:0;left:0;width:100%;height:100%;background:var(--gradient-primary);display:flex;align-items:center;justify-content:center;z-index:var(--z-loading)}.loading-content{text-align:center;animation:fadeInUp .8s var(--animation-bounce)}.loading-spinner{width:60px;height:60px;border:4px solid rgba(255,255,255,.2);border-top:4px solid var(--text-primary);border-radius:50%;animation:spin 1s linear infinite;margin:0 auto var(--spacing-lg)}.loading-text{font-size:var(--font-size-lg);font-weight:500;margin-bottom:var(--spacing-lg);text-shadow:2px 2px 4px rgba(0,0,0,.5)}.loading-progress{width:200px;height:6px;background:#fff3;border-radius:3px;overflow:hidden;margin:0 auto}.loading-bar{height:100%;background:var(--gradient-accent);border-radius:3px;animation:loading-progress 2s ease-in-out infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes loading-progress{0%{width:0%}50%{width:70%}to{width:100%}}.game-container{position:relative;width:100%;height:100vh;overflow:hidden}.background-layer{position:absolute;top:0;left:0;width:100%;height:100%;z-index:var(--z-background)}.background-canvas{position:absolute;top:0;left:0;width:100%;height:100%}.background-particles{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.character-layer{position:absolute;top:0;left:0;width:100%;height:100%;z-index:var(--z-character);pointer-events:none}.live2d-canvas{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:auto}.ui-layer{position:absolute;top:0;left:0;width:100%;height:100%;z-index:var(--z-ui);pointer-events:none}.ui-layer *{pointer-events:auto}.top-ui{position:absolute;top:0;left:0;width:100%;padding:var(--spacing-lg);display:flex;justify-content:space-between;align-items:flex-start}.title-area{animation:slideInLeft .8s var(--animation-bounce)}.title-main{font-size:var(--font-size-xxl);font-weight:700;text-shadow:3px 3px 6px rgba(0,0,0,.7);margin-bottom:var(--spacing-xs);background:var(--gradient-accent);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.title-sub{font-family:var(--font-accent);font-size:var(--font-size-sm);opacity:.9;text-shadow:1px 1px 2px rgba(0,0,0,.8)}.nav-menu{display:flex;gap:var(--spacing-sm);animation:slideInRight .8s var(--animation-bounce)}.nav-button{background:var(--bg-glass);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:2px solid rgba(255,255,255,.3);border-radius:12px;padding:var(--spacing-sm);color:var(--text-primary);cursor:pointer;transition:all var(--transition-normal);min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center}.nav-button:hover{background:#fff3;border-color:#ffffff80;transform:translateY(-2px);box-shadow:0 4px 12px #0000004d}.nav-button:active{transform:translateY(0)}.nav-icon{font-size:var(--font-size-lg)}.stats-display{position:absolute;top:var(--spacing-xl);right:var(--spacing-xl);display:flex;flex-direction:column;gap:var(--spacing-sm);animation:fadeInDown 1s var(--animation-bounce) .5s both}.stat-item{background:var(--bg-glass);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:2px solid rgba(255,255,255,.2);border-radius:12px;padding:var(--spacing-sm) var(--spacing-md);text-align:center;min-width:120px}.stat-label{display:block;font-size:var(--font-size-xs);opacity:.8;margin-bottom:var(--spacing-xs)}.stat-value{display:block;font-size:var(--font-size-lg);font-weight:700;color:var(--accent-color);text-shadow:1px 1px 2px rgba(0,0,0,.8)}#message-container{position:absolute;bottom:0;left:0;width:100%;padding:var(--spacing-xl)}.character-nameplate{position:absolute;bottom:100%;left:var(--spacing-xl);margin-bottom:var(--spacing-sm);background:var(--gradient-secondary);border:3px solid var(--text-primary);border-radius:20px 20px 5px;padding:var(--spacing-sm) var(--spacing-lg);box-shadow:0 4px 12px #0006;transform:translateY(10px);opacity:0;transition:all var(--transition-normal)}.character-nameplate.show{transform:translateY(0);opacity:1}.character-name{font-size:var(--font-size-sm);font-weight:500;text-shadow:1px 1px 2px rgba(0,0,0,.5)}.message-window{background:var(--bg-overlay);-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);border:3px solid rgba(255,255,255,.3);border-radius:20px;padding:var(--spacing-xl);min-height:120px;position:relative;box-shadow:0 8px 32px #0006;transform:translateY(50px);opacity:0;transition:all var(--transition-slow)}.message-window.show{transform:translateY(0);opacity:1}.message-text{font-size:var(--font-size-md);line-height:1.8;text-shadow:1px 1px 2px rgba(0,0,0,.8);min-height:60px;display:flex;align-items:center}.continue-button{position:absolute;right:var(--spacing-lg);bottom:var(--spacing-lg);background:var(--bg-glass);border:2px solid var(--text-primary);border-radius:50%;width:50px;height:50px;color:var(--text-primary);cursor:pointer;transition:all var(--transition-normal);display:flex;align-items:center;justify-content:center;animation:pulse 2s infinite}.continue-button:hover{background:#fff3;transform:scale(1.1)}.continue-icon{font-size:var(--font-size-lg)}.choice-system{margin-top:var(--spacing-lg);animation:fadeInUp .6s var(--animation-bounce)}.choice-container{display:flex;flex-direction:column;gap:var(--spacing-md);max-width:600px;margin:0 auto}.choice-button{background:var(--gradient-glass);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:3px solid var(--accent-color);border-radius:25px;padding:var(--spacing-lg) var(--spacing-xl);color:var(--text-primary);font-size:var(--font-size-md);font-weight:500;cursor:pointer;transition:all var(--transition-normal);text-align:left;position:relative;overflow:hidden;box-shadow:0 4px 16px #0003}.choice-button:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .6s ease}.choice-button:hover:before{left:100%}.choice-button:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 8px 24px #f0d00066;border-color:#ffdf00;background:#ffffff26}.choice-button:active{transform:translateY(-1px) scale(1.01)}.choice-icon{margin-right:var(--spacing-sm);font-size:var(--font-size-lg)}.message-controls{position:absolute;right:var(--spacing-xl);top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:var(--spacing-sm)}.control-button{background:var(--bg-glass);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:2px solid rgba(255,255,255,.3);border-radius:12px;padding:var(--spacing-sm);color:var(--text-primary);cursor:pointer;transition:all var(--transition-normal);width:44px;height:44px;display:flex;align-items:center;justify-content:center;font-size:var(--font-size-sm)}.control-button:hover{background:#fff3;transform:scale(1.1)}.control-button.active{background:var(--secondary-color);border-color:var(--secondary-color)}.context-menu{position:fixed;background:var(--bg-modal);-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);border:2px solid rgba(255,255,255,.3);border-radius:12px;padding:var(--spacing-sm);z-index:var(--z-modal);box-shadow:0 8px 32px #00000080;animation:fadeInScale .2s ease}.context-item{padding:var(--spacing-sm) var(--spacing-lg);cursor:pointer;transition:background var(--transition-fast);border-radius:8px;font-size:var(--font-size-sm)}.context-item:hover{background:#fff3}.modal{position:fixed;top:0;left:0;width:100%;height:100%;background:#000c;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:var(--z-modal);display:flex;align-items:center;justify-content:center;animation:fadeIn .3s ease}.modal-content{background:var(--bg-modal);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:2px solid rgba(255,255,255,.3);border-radius:20px;max-width:500px;width:90%;max-height:80%;overflow-y:auto;box-shadow:0 16px 64px #0009;animation:slideInUp .4s var(--animation-bounce)}.modal-header{padding:var(--spacing-lg) var(--spacing-xl);border-bottom:1px solid rgba(255,255,255,.2);display:flex;justify-content:space-between;align-items:center}.modal-header h3{font-size:var(--font-size-xl);font-weight:700}.modal-close{background:none;border:none;color:var(--text-primary);font-size:var(--font-size-xl);cursor:pointer;padding:var(--spacing-sm);border-radius:8px;transition:background var(--transition-fast)}.modal-close:hover{background:#fff3}.modal-body{padding:var(--spacing-xl)}.setting-group{margin-bottom:var(--spacing-lg)}.setting-group label{display:block;margin-bottom:var(--spacing-sm);font-weight:500}.setting-group input[type=range]{width:100%;height:6px;border-radius:3px;background:#fff3;outline:none;-webkit-appearance:none}.setting-group input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;border-radius:50%;background:var(--accent-color);cursor:pointer;box-shadow:0 2px 8px #0000004d}.history-list{max-height:300px;overflow-y:auto}.history-item{padding:var(--spacing-md);border-bottom:1px solid rgba(255,255,255,.1);font-size:var(--font-size-sm);line-height:1.6}.history-item:last-child{border-bottom:none}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-30px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInLeft{0%{opacity:0;transform:translate(-50px)}to{opacity:1;transform:translate(0)}}@keyframes slideInRight{0%{opacity:0;transform:translate(50px)}to{opacity:1;transform:translate(0)}}@keyframes slideInUp{0%{opacity:0;transform:translateY(50px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInScale{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.05);opacity:.8}}.glow{box-shadow:0 0 20px var(--accent-color)}.shake{animation:shake .5s ease-in-out}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}.bounce{animation:bounceIn .6s var(--animation-bounce)}@keyframes bounceIn{0%{transform:scale(.3);opacity:0}50%{transform:scale(1.05);opacity:.8}70%{transform:scale(.9);opacity:.9}to{transform:scale(1);opacity:1}}@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}.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}.fade-enter-active,.fade-leave-active{transition:opacity .3s ease}.fade-enter-from,.fade-leave-to{opacity:0}.message-box{cursor:pointer;position:relative}.message-box .text-galge-gray{color:#fff9}.typing-cursor:after{content:"|";animation:blink 1s infinite;opacity:1}@keyframes blink{0%,50%{opacity:1}51%,to{opacity:0}}.game-frame-container{position:fixed;top:0;left:0;width:100vw;height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#eeeaf4,#e4e0ed);z-index:1;opacity:0;transition:opacity .5s ease}.game-frame-container.visible{opacity:1}.console-frame{position:relative;width:1020px;height:800px;display:flex;background:linear-gradient(145deg,#f0ecf5,#e8e3f0);border-radius:40px;box-shadow:0 20px 60px #9b8bb426,0 0 80px #9b8bb414,inset 0 0 30px #ffffff80;transform:perspective(2000px) rotateX(1deg) rotateY(0);overflow:hidden}.console-frame:before{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:linear-gradient(135deg,transparent 40%,rgba(255,255,255,.15) 50%,transparent 60%);pointer-events:none}.side-panel-left,.side-panel-right{width:70px;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;padding:40px 10px;z-index:100}.side-panel-left{background:linear-gradient(180deg,#fff,#f7f5fa);border-radius:40px 0 0 40px}.side-panel-right{background:linear-gradient(180deg,#fff,#f7f5fa);border-radius:0 40px 40px 0}.side-panel-left:after,.side-panel-right:after{content:"";position:absolute;top:12px;right:12px;bottom:12px;left:12px;border-radius:30px;background:transparent;border:1px solid rgba(155,139,180,.15)}.rail-dot{width:8px;height:8px;border-radius:50%;background:#9b8bb440;margin:12px 0;transition:all .3s ease;box-shadow:0 0 6px #9b8bb41a}.rail-dot:hover{background:#9b8bb473;box-shadow:0 0 12px #9b8bb440}.screen-container{flex:1;display:flex;flex-direction:column;position:relative;z-index:1}.status-bar{height:50px;background:#9b8bb40f;display:flex;align-items:center;justify-content:space-between;padding:0 24px}.device-name{font-size:13px;font-weight:400;font-family:Sawarabi Gothic,Noto Sans JP,sans-serif;color:#9b8bb4;letter-spacing:.12em;animation:subtle-glow 3s ease-in-out infinite}.status-indicators{display:flex;gap:12px;align-items:center}.indicator{width:6px;height:6px;border-radius:50%;background:#b8a5d4;box-shadow:0 0 8px #9b8bb44d;animation:pulse 2s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}.screen-area{flex:1;padding:16px;display:flex;align-items:center;justify-content:center}.screen-bezel{width:100%;height:100%;background:#000;border-radius:16px;padding:3px;box-shadow:inset 0 0 30px #000000e6,0 0 15px #9b8bb426;position:relative;overflow:hidden}.screen-bezel:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:16px;padding:2px;background:linear-gradient(45deg,#b8a5d4,#9b8bb4,#d5d0e0,#9b8bb4,#b8a5d4);background-size:300% 300%;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:gradient-shift 4s ease infinite;opacity:.4}@keyframes gradient-shift{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}@keyframes subtle-glow{0%,to{filter:brightness(1) blur(0px);opacity:.8}50%{filter:brightness(1.1) blur(.3px);opacity:1}}.screen-wrapper{width:100%;height:100%;border-radius:13px;overflow:hidden;position:relative;z-index:1}.bottom-bar{height:50px;background:#9b8bb40f;display:flex;align-items:center;justify-content:center}.brand-logo{font-size:14px;font-weight:300;font-family:Bebas Neue,Oswald,sans-serif;letter-spacing:4px;color:transparent;background:linear-gradient(90deg,#9b8bb4,#b8a5d4,#9b8bb4);background-clip:text;-webkit-background-clip:text;text-transform:uppercase;animation:subtle-glow 3s ease-in-out infinite}.control-element{background:#ffffff0d;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1);border-radius:12px;transition:all .2s;position:relative;z-index:110}.circular-dpad{width:120px;height:120px;position:relative;margin:20px 0}.dpad-center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:40px;height:40px;border-radius:50%}.dpad-direction{position:absolute;border-radius:8px;cursor:pointer}.dpad-up,.dpad-down{width:30px;height:40px;left:50%;transform:translate(-50%)}.dpad-left,.dpad-right{width:40px;height:30px;top:50%;transform:translateY(-50%)}.analog-stick{width:80px;height:80px;border-radius:50%;position:relative;margin:20px 0}.stick-knob{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:50px;height:50px;border-radius:50%;cursor:grab}.action-buttons{width:120px;height:120px;position:relative;margin:20px 0}.btn-action{position:absolute;width:40px;height:40px;border-radius:50%;border:none;cursor:pointer}.btn-special{width:60px;height:30px;border-radius:15px;border:none;cursor:pointer}.special-buttons{display:flex;flex-direction:column;gap:15px}