@import url(https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;600;700&family=Manrope:wght@400;500;600&family=Noto+Sans+JP:wght@400;500;700&family=Zen+Old+Mincho:wght@400;700&display=swap);:root{--color-primary:#6b4eff;--color-background:#1a1c1f;--color-surface:#262830;--color-text:#e7e4df;--color-accent:#c9a66b;--color-success:#5ba18b;--color-error:#d46a6a;--font-heading-ja:"Zen Old Mincho",serif;--font-heading-en:"Cormorant Garamond",serif;--font-body-ja:"Noto Sans JP",sans-serif;--font-body-en:"Manrope",sans-serif;--font-numbers:"Manrope",sans-serif;--font-heading:"Cormorant Garamond","Zen Old Mincho",serif;--font-body:"Manrope","Noto Sans JP",sans-serif;--font-size-hero:56px;--font-size-h1:36px;--font-size-h2:28px;--font-size-h3:22px;--font-size-body:16px;--font-size-caption:14px;--bg-dark:var(--color-background);--bg-darker:#121316;--bg-panel:#262830b3;--bg-panel-solid:var(--color-surface);--bg-input:#1a1c1f99;--primary:var(--color-primary);--secondary:var(--color-accent);--accent:var(--color-accent);--text-main:var(--color-text);--text-muted:#e7e4df99;--border-color:#e7e4df1a;--border-focus:var(--color-primary);--transition-smooth:all 0.2s ease-out}body{background-color:var(--color-background);color:var(--color-text);font-family:var(--font-body);font-size:var(--font-size-body);margin:0;padding:0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.font-heading{font-family:var(--font-heading)}.font-body{font-family:var(--font-body)}.font-heading-ja{font-family:var(--font-heading-ja)}.font-heading-en{font-family:var(--font-heading-en)}.font-body-ja{font-family:var(--font-body-ja)}.font-body-en{font-family:var(--font-body-en)}.font-numbers{font-family:var(--font-numbers)}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);font-weight:400;margin:0}h1{font-size:var(--font-size-h1)}h2{font-size:var(--font-size-h2)}h3{font-size:var(--font-size-h3)}*,:after,:before{box-sizing:border-box}#root{display:flex;flex-direction:column;height:100vh}.glass-panel{backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);background-color:#262830b3;border:1px solid #e7e4df1a;border-radius:12px;box-shadow:0 4px 15px #0003}button{border:1px solid #0000;color:var(--color-text);cursor:pointer;font-family:var(--font-body-ja);outline:none;transition:all .2s ease-out}button:hover:not(:disabled){border-color:var(--color-primary);box-shadow:0 4px 15px #6b4eff66;transform:translateY(-2px)}a{color:var(--color-text);text-decoration:none}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.comments-list::-webkit-scrollbar,.modal-container::-webkit-scrollbar{width:8px}.comments-list::-webkit-scrollbar-track,.modal-container::-webkit-scrollbar-track{background:var(--bg-darker)}.comments-list::-webkit-scrollbar-thumb,.modal-container::-webkit-scrollbar-thumb{background:#ffffff26;border-radius:4px}.comments-list::-webkit-scrollbar-thumb:hover,.modal-container::-webkit-scrollbar-thumb:hover{background:var(--secondary)}.modal-backdrop{align-items:center;animation:fadeIn .5s ease-out;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);background:#050608d9;display:flex;height:100vh;justify-content:center;left:0;padding:20px;position:fixed;top:0;width:100vw;z-index:100}.modal-container{animation:modalScaleUp .5s cubic-bezier(.34,1.56,.64,1);background:var(--bg-panel-solid);border:1px solid var(--border-color);border-radius:24px;box-shadow:0 20px 60px #0009;display:flex;flex-direction:column;max-height:90vh;overflow-y:auto;position:relative;width:100%}@keyframes modalScaleUp{0%{opacity:0;transform:scale(.9) translateY(20px)}to{opacity:1;transform:scale(1) translateY(0)}}.modal-close-btn{align-items:center;background:#ffffff0d;border:none;border-radius:50%;color:var(--text-muted);cursor:pointer;display:flex;height:36px;justify-content:center;position:absolute;right:20px;top:20px;transition:var(--transition-smooth);width:36px;z-index:5}.modal-close-btn:hover{background:#ffffff1a;color:var(--text-main)}.mix-detail-modal{height:640px;max-width:950px;padding:30px}.modal-content-grid{display:grid;gap:35px;grid-template-columns:1.1fr 1fr;margin-top:10px}@media(max-width:768px){.modal-content-grid{grid-template-columns:1fr}}.modal-left-col,.modal-right-col{display:flex;flex-direction:column;gap:24px}.modal-right-col{border-left:1px solid var(--border-color);padding-left:30px}@media(max-width:768px){.mix-detail-modal{height:auto}.modal-right-col{border-left:none;border-top:1px solid var(--border-color);padding-left:0;padding-top:24px}}.modal-date{align-items:center;color:var(--text-muted);display:inline-flex;font-size:.8rem;margin-bottom:8px}.modal-mix-title{font-size:1.8rem;font-weight:850;line-height:1.3;margin-bottom:16px}.creator-row{align-items:center;display:flex;gap:12px;margin-bottom:8px}.creator-avatar-large{border:2px solid var(--border-color);border-radius:50%;height:44px;object-fit:cover;width:44px}.creator-name-large{font-size:.95rem;font-weight:700}.creator-rating-stars{align-items:center;display:flex;font-size:.9rem;gap:2px;margin-top:2px}.creator-rating-stars,.star-filled,.star-half{color:var(--color-accent)}.star-half{display:inline-block;position:relative}.star-empty{color:#4a4b57}.rating-num{color:var(--text-muted);font-size:.8rem;margin-left:6px}.modal-description-box{background:#ffffff05;border:1px solid var(--border-color);border-radius:12px;padding:20px}.modal-description-box h3,.modal-section h3{color:var(--text-main);font-size:.95rem;font-weight:700;margin-bottom:12px}.modal-description-box p{color:var(--text-muted);font-size:.9rem;line-height:1.6}.detail-flavor-list{display:flex;flex-direction:column;gap:12px}.detail-flavor-item{align-items:center;background:var(--bg-panel);border:1px solid var(--border-color);border-radius:12px;display:flex;justify-content:space-between;padding:12px 18px}.flavor-indicator{align-items:center;display:flex;gap:12px}.flavor-color-block{border-radius:4px;height:24px;width:14px}.flavor-detail-texts{display:flex;flex-direction:column}.detail-flavor-brand{color:var(--text-muted);font-size:.75rem;letter-spacing:.5px;text-transform:uppercase}.detail-flavor-name{font-size:.95rem;font-weight:700}.flavor-percentage-pill{border:2px solid;border-radius:20px;font-size:.85rem;font-weight:800;padding:4px 14px}.tasting-bars{gap:14px}.tasting-bar-row,.tasting-bars{display:flex;flex-direction:column}.tasting-bar-row{gap:6px}.tasting-bar-label{display:flex;font-size:.85rem;font-weight:600;justify-content:space-between}.tasting-bar-value{color:var(--text-muted)}.tasting-bar-bg{background:#ffffff0d;border-radius:5px;height:10px;overflow:hidden;width:100%}.tasting-bar-fill{border-radius:5px;height:100%;transition:width .8s ease-out}.section-title-icon-row{align-items:center;display:flex;gap:8px;margin-bottom:12px}.heat-mgmt-section .icon-flame{color:var(--primary)}.heat-details-card{background:#ff767508;border:1px solid #ff767526;border-radius:12px;display:flex;flex-direction:column;gap:12px;padding:20px}.heat-detail-row{border-bottom:1px dashed var(--border-color);display:flex;font-size:.85rem;justify-content:space-between;padding-bottom:8px}.heat-detail-row:last-of-type{border-bottom:none;padding-bottom:0}.heat-label{color:var(--text-muted)}.heat-value{font-weight:700}.heat-note{background:#ffffff08;border-radius:8px;display:flex;gap:8px;margin-top:4px;padding:10px 14px}.heat-note .icon-help{color:var(--secondary);flex-shrink:0;margin-top:2px}.heat-note p{color:var(--text-muted);font-size:.8rem;line-height:1.4}.detail-actions-row{display:grid;gap:16px;grid-template-columns:1fr 1fr}.action-btn-large{align-items:center;border-radius:12px;cursor:pointer;display:flex;font-size:.9rem;font-weight:700;gap:8px;justify-content:center;padding:12px;transition:var(--transition-smooth)}.like-btn{background:#ffffff08;border:1px solid var(--border-color);color:var(--text-main)}.like-btn:hover{background:#ff76751a;border-color:var(--primary);color:var(--primary)}.like-btn.active{background:var(--primary);border-color:var(--primary);box-shadow:0 4px 15px #ff76754d;color:#fff}.bookmark-btn{background:#ffffff08;border:1px solid var(--border-color);color:var(--text-main)}.bookmark-btn:hover{background:#a29bfe1a;border-color:var(--secondary);color:var(--secondary)}.bookmark-btn.active{background:var(--secondary);border-color:var(--secondary);box-shadow:0 4px 15px #a29bfe4d;color:#fff}.comments-section{gap:12px}.comments-list,.comments-section{display:flex;flex-direction:column}.comments-list{gap:14px;max-height:250px;overflow-y:auto;padding-right:6px}.no-comments{color:var(--text-muted);font-size:.8rem;padding:20px 0;text-align:center}.comment-item{background:#ffffff03;border:1px solid var(--border-color);border-radius:12px;display:flex;gap:12px;padding:12px}.comment-avatar{border-radius:50%;height:32px;object-fit:cover;width:32px}.comment-body{display:flex;flex:1;flex-direction:column;gap:4px}.comment-header{display:flex;font-size:.75rem;justify-content:space-between}.comment-user{font-weight:700}.comment-text,.comment-time{color:var(--text-muted)}.comment-text{font-size:.85rem;line-height:1.4}.comment-input-form{display:flex;gap:10px;margin-top:6px}.comment-input{background:var(--bg-input);border:1px solid var(--border-color);border-radius:10px;color:var(--text-main);flex:1;font-size:.85rem;outline:none;padding:10px 14px;transition:var(--transition-smooth)}.comment-input:focus{border-color:var(--secondary)}.comment-send-btn{align-items:center;background:var(--secondary);border:none;border-radius:10px;color:#fff;cursor:pointer;display:flex;height:38px;justify-content:center;transition:var(--transition-smooth);width:38px}.comment-send-btn:hover{background:#8c82f0;transform:scale(1.05)}.create-mix-modal{max-width:880px;padding:35px}.modal-title-main{font-size:1.6rem;font-weight:800;margin-bottom:6px}.modal-subtitle{color:var(--text-muted);font-size:.9rem;margin-bottom:24px}.create-mix-form{display:flex;flex-direction:column;gap:20px}.form-grid{display:grid;gap:30px;grid-template-columns:1.1fr .9fr}@media(max-width:768px){.form-grid{grid-template-columns:1fr}}.form-left-panel,.form-right-panel{display:flex;flex-direction:column;gap:20px}.form-right-panel{border-left:1px solid var(--border-color);padding-left:30px}@media(max-width:768px){.form-right-panel{border-left:none;border-top:1px solid var(--border-color);padding-left:0;padding-top:24px}}.form-group{display:flex;flex-direction:column;gap:8px}.form-label{color:var(--text-main);display:flex;font-size:.85rem;font-weight:700;justify-content:space-between}.req{color:var(--primary);margin-left:4px}.form-input{background:var(--bg-input);border:1px solid var(--border-color);border-radius:8px;color:var(--text-main);font-size:.9rem;outline:none;padding:12px 16px;transition:var(--transition-smooth)}.form-input:focus{border-color:var(--secondary);box-shadow:0 0 10px #a29bfe26}.form-textarea{background:var(--bg-input);border:1px solid var(--border-color);border-radius:8px;color:var(--text-main);font-size:.9rem;outline:none;padding:12px 16px;resize:vertical;transition:var(--transition-smooth)}.form-textarea:focus{border-color:var(--secondary)}.flavor-inputs-list{display:flex;flex-direction:column;gap:10px}.flavor-input-row{align-items:center;display:flex;gap:8px}.color-picker-input{background:#0000;border:none;cursor:pointer;flex-shrink:0;height:38px;width:32px}.brand-select{cursor:pointer;flex-shrink:0;width:120px}.brand-select,.flavor-name-input{background:var(--bg-input);border:1px solid var(--border-color);border-radius:8px;color:var(--text-main);font-size:.85rem;height:38px;outline:none;padding:8px 12px}.flavor-name-input{flex:1}.flavor-name-input:focus{border-color:var(--secondary)}.ratio-input-wrapper{align-items:center;background:var(--bg-input);border:1px solid var(--border-color);border-radius:8px;display:flex;flex-shrink:0;height:38px;padding:0 8px;width:80px}.ratio-number-input{-moz-appearance:textfield;background:#0000;border:none;color:var(--text-main);font-size:.85rem;outline:none;text-align:right;width:100%}.ratio-number-input::-webkit-inner-spin-button,.ratio-number-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.ratio-symbol{color:var(--text-muted);font-size:.8rem;margin-left:4px}.remove-flavor-btn{align-items:center;background:#0000;border:1px solid var(--border-color);border-radius:8px;color:var(--text-muted);cursor:pointer;display:flex;flex-shrink:0;height:38px;justify-content:center;transition:var(--transition-smooth);width:38px}.remove-flavor-btn:hover:not(:disabled){background:#ff76750d;border-color:var(--primary);color:var(--primary)}.remove-flavor-btn:disabled{cursor:not-allowed;opacity:.3}.flavor-actions-bar{align-items:center;display:flex;justify-content:space-between;margin-top:6px}.btn-add-flavor{align-items:center;background:#0000;border:1px dashed var(--secondary);border-radius:8px;color:var(--secondary);cursor:pointer;display:flex;font-size:.8rem;font-weight:600;padding:8px 14px;transition:var(--transition-smooth)}.btn-add-flavor:hover:not(:disabled){background:#a29bfe0d;border-style:solid}.btn-add-flavor:disabled{cursor:not-allowed;opacity:.4}.btn-auto-balance{align-items:center;background:#a29bfe1a;border:1px solid #a29bfe33;border-radius:8px;color:var(--secondary);cursor:pointer;display:flex;font-size:.8rem;font-weight:600;padding:8px 14px;transition:var(--transition-smooth)}.btn-auto-balance:hover{background:#a29bfe33;box-shadow:0 0 10px #a29bfe1a}.ratio-indicator-box{align-items:center;border-radius:8px;display:flex;font-size:.8rem;font-weight:700;margin-top:6px;padding:10px 14px}.ratio-indicator-box.valid{background:#2fd17e14;border:1px solid #2fd17e40;color:#2fd17e}.ratio-indicator-box.invalid{background:#ff767514;border:1px solid #ff767540;color:var(--primary)}.slider-group-container{background:#ffffff05;border:1px solid var(--border-color);border-radius:12px;display:flex;flex-direction:column;gap:16px;padding:16px}.slider-row{display:flex;flex-direction:column;gap:6px}.slider-label{color:var(--text-muted);display:flex;font-size:.8rem;font-weight:700;justify-content:space-between}.form-slider{-webkit-appearance:none;background:#ffffff14;border-radius:3px;cursor:pointer;height:6px;outline:none;width:100%}.form-slider::-webkit-slider-thumb{-webkit-appearance:none;background:#fff;border-radius:50%;box-shadow:0 2px 6px #0000004d;height:16px;transition:transform .1s ease;width:16px}.form-slider::-webkit-slider-thumb:hover{transform:scale(1.2)}.slider-sweet::-webkit-slider-runnable-track{background:linear-gradient(90deg,#e843931a,#e84393cc)}.slider-cool::-webkit-slider-runnable-track{background:linear-gradient(90deg,#0984e31a,#0984e3cc)}.slider-spice::-webkit-slider-runnable-track{background:linear-gradient(90deg,#fdcb6e1a,#fdcb6ecc)}.slider-rich::-webkit-slider-runnable-track{background:linear-gradient(90deg,#6c5ce71a,#6c5ce7cc)}.heat-inputs{background:#ffffff05;border:1px solid var(--border-color);border-radius:12px;display:flex;flex-direction:column;gap:12px;padding:16px}.heat-inputs .sub-group{display:flex;flex-direction:column;gap:6px}.sub-label{color:var(--text-muted);font-size:.75rem;font-weight:600}.form-input-sub{background:var(--bg-input);border:1px solid var(--border-color);border-radius:6px;color:var(--text-main);font-size:.85rem;outline:none;padding:8px 12px}.form-input-sub:focus{border-color:var(--secondary)}.form-footer-actions{border-top:1px solid var(--border-color);display:flex;gap:14px;justify-content:flex-end;margin-top:10px;padding-top:24px}.btn-secondary{background:#0000;border:1px solid var(--border-color);border-radius:30px;color:var(--text-muted);cursor:pointer;font-size:.9rem;font-weight:600;padding:10px 24px;transition:var(--transition-smooth)}.btn-secondary:hover{background:#ffffff0d;color:var(--text-main)}.btn-primary-submit{background:linear-gradient(135deg,var(--primary),#e84393);border:none;border-radius:30px;box-shadow:0 4px 15px #ff76754d;color:#fff;cursor:pointer;font-size:.9rem;font-weight:700;padding:10px 28px;transition:var(--transition-smooth)}.btn-primary-submit:hover:not(:disabled){box-shadow:0 6px 20px #ff767580;transform:translateY(-2px)}.btn-primary-submit:disabled{box-shadow:none;cursor:not-allowed;opacity:.4;transform:none}.flip-card-popup-wrapper{background-color:#0000;height:480px;max-width:90vw;perspective:1000px;width:400px}.flip-card-inner{height:100%;position:relative;text-align:center;transform-style:preserve-3d;transition:transform .6s cubic-bezier(.4,0,.2,1);width:100%}.flip-card-inner.flipped{transform:rotateY(180deg)}.flip-card-back,.flip-card-front{-webkit-backface-visibility:hidden;backface-visibility:hidden;background-color:var(--color-surface);border:1px solid #e7e4df1a;border-radius:16px;box-shadow:0 10px 30px #0006;display:flex;flex-direction:column;height:100%;justify-content:space-between;padding:30px;position:absolute;text-align:left;width:100%}.flip-card-back{align-items:center;justify-content:space-between;transform:rotateY(180deg)}.card-flavor-list-scroll{overflow-y:overlay}.card-flavor-list-scroll::-webkit-scrollbar{width:5px}.card-flavor-list-scroll::-webkit-scrollbar-track{background:#0000}.card-flavor-list-scroll::-webkit-scrollbar-thumb{background:#e7e4df26;border-radius:4px}.card-flavor-list-scroll::-webkit-scrollbar-thumb:hover{background:var(--color-accent)}@keyframes slideUpFade{0%{opacity:0;transform:translateX(-50%) translateY(0)}to{opacity:1;transform:translateX(-50%) translateY(-8px)}}.hover-scrollbar{overflow-y:auto}.hover-scrollbar::-webkit-scrollbar{width:6px}.hover-scrollbar::-webkit-scrollbar-track{background:#0000}.hover-scrollbar::-webkit-scrollbar-thumb{background:#0000;border-radius:3px}.hover-scrollbar:hover::-webkit-scrollbar-thumb{background:#e7e4df40}.hover-scrollbar:hover::-webkit-scrollbar-thumb:hover{background:#e7e4df66}.custom-recipe-slider{-webkit-appearance:none;appearance:none;background:#0000;bottom:-12px;cursor:pointer;height:14px;left:0;margin:0;position:absolute;width:100%}.custom-recipe-slider:focus{outline:none}.custom-recipe-slider::-webkit-slider-runnable-track{background:#e7e4df33;border-radius:1px;height:2px;width:100%}.custom-recipe-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:var(--color-primary);border-radius:50%;box-shadow:0 1px 4px #0006;height:12px;margin-top:-5px;transition:transform .1s,background-color .1s;width:12px}.custom-recipe-slider::-webkit-slider-thumb:hover{transform:scale(1.2)}@keyframes hudFadeIn{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes hudFadeOut{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.85)}}@keyframes hudSpin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes hudCheckScale{0%{opacity:0;transform:translate(-50%,-50%) scale(.5)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}@keyframes hudShake{0%,to{transform:translate(-50%,-50%) translateX(0)}20%{transform:translate(-50%,-50%) translateX(-6px)}40%{transform:translate(-50%,-50%) translateX(5px)}60%{transform:translate(-50%,-50%) translateX(-4px)}80%{transform:translate(-50%,-50%) translateX(3px)}}.ripple-btn,button{overflow:hidden;position:relative}.ripple-effect{animation:rippleAnimation .9s ease-out;background-color:#6b4eff73;border-radius:50%;pointer-events:none;position:absolute;transform:scale(0)}@keyframes rippleAnimation{0%{opacity:1;transform:scale(0)}to{opacity:0;transform:scale(4)}}@keyframes pageFadeIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}@keyframes modalScaleDown{0%{opacity:1;transform:scale(1) translateY(0)}to{opacity:0;transform:scale(.9) translateY(20px)}}.modal-backdrop.closing{animation:fadeOut .5s ease-in forwards!important}.modal-backdrop.closing .glass-panel,.modal-backdrop.closing .modal-container{animation:modalScaleDown .5s cubic-bezier(.25,1,.5,1) forwards!important}@keyframes pulseScale{0%{box-shadow:0 4px 20px #0006,0 0 0 0 #6b4eff73;transform:scale(1)}50%{box-shadow:0 4px 25px #00000080,0 0 0 35px #6b4eff00;transform:scale(1.1)}to{box-shadow:0 4px 20px #0006,0 0 0 0 #6b4eff00;transform:scale(1)}}.pulse-button{animation:pulseScale 1.8s ease-in-out infinite}body.no-animations *,body.no-animations :after,body.no-animations :before{animation:none!important;transition:none!important}.hero-action-btn{align-items:center;background-color:var(--color-surface);border:1px solid #e7e4df1a;border-radius:12px;box-shadow:0 4px 15px #0003;color:var(--color-text);cursor:pointer;display:flex;font-family:var(--font-heading-ja);font-size:var(--font-size-h1);gap:16px;justify-content:center;max-width:100%;padding:24px 60px;transition:all .2s ease-out;width:600px}.hero-action-btn:hover{border-color:var(--color-primary);box-shadow:0 4px 15px #6b4eff66;transform:translateY(-2px)}@media(max-width:768px){.hero-action-btn{font-size:var(--font-size-h3);gap:12px;padding:16px 24px}}.hero-action-icon{height:36px!important;width:36px!important}@media(max-width:768px){.hero-action-icon{height:24px!important;width:24px!important}}
/*# sourceMappingURL=style.css.map*/