:root{--radius-xs:10px;--radius-sm:15px
}body{font-family:"Hiragino Kaku Gothic ProN", "Yu Gothic", "Meiryo", sans-serif;background:var(--color-background);color:var(--color-text);overflow-x:hidden
}button,
input,
select{font:inherit
}button{cursor:pointer
}.page{width:min(100%, var(--max));max-width:var(--max);margin:0 auto;overflow-x:clip
}.title-up,
.title-dw{white-space:nowrap
}.title-dw{padding:5px 0 0;color:var(--color-text);font-size:25px;font-weight:bold
}.unit-body{padding:15px;background:var(--color-white)
}.unit-control-block,
.unit-result-block{padding:15px;border:1.75px solid var(--color-primary);border-radius:var(--radius-xs);background:var(--color-white);box-shadow:var(--shadow-card)
}.unit-control-block{margin-bottom:15px
}.unit-controls{display:grid;grid-template-columns:minmax(280px, 1fr) minmax(160px, .42fr) minmax(180px, .55fr);gap:10px;align-items:center
}.unit-control-item{display:grid;grid-template-columns:5em minmax(0, 1fr);align-items:center;gap:10px;min-width:0
}.unit-control-label{color:var(--color-text);font-size:.92rem;font-weight:900;text-align:center;white-space:nowrap
}.unit-input,
.unit-select,
.unit-member-select,
.unit-producer-input{width:100%;min-width:0;border:1.75px solid var(--color-primary);border-radius:var(--radius-xs);background:var(--color-white);color:var(--color-text);font:inherit
}.unit-input,
.unit-select{min-height:40px;padding:10px 10px;font-size:.95rem
}.unit-member-select{min-height:35px;padding:5px 10px;border-color:var(--row-accent, var(--color-primary));font-size:.9rem;font-weight:800
}.unit-input:focus,
.unit-select:focus,
.unit-member-select:focus,
.unit-producer-input:focus{outline:2px solid var(--color-primary-light);outline-offset:1px
}.unit-output-head{display:grid;grid-template-columns:minmax(0, 1fr) auto;align-items:center;gap:10px;margin-bottom:10px;padding:10px;border-radius:var(--radius-xs);background:var(--color-primary);color:var(--color-white);text-align:center
}.unit-output-title{margin:0;padding-left:5.4em;font-size:1.28rem;font-weight:900;line-height:1.35;word-break:break-word
}.unit-reset-btn,
.unit-copy-btn,
.unit-save-btn{display:inline-flex;align-items:center;justify-content:center;min-height:30px;padding:5px 10px;border-radius:999px;font:inherit;font-size:.86rem;font-weight:900;line-height:1;white-space:nowrap;transition:background .15s ease, color .15s ease, transform .15s ease
}.unit-reset-btn{min-width:5.4em;border:1.5px solid var(--color-white);background:var(--color-white);color:var(--color-text)
}.unit-reset-btn:hover{background:var(--color-primary-light);transform:translateY(-1px)
}.unit-grid{display:grid;gap:10px
}.unit-row{--row-accent:var(--color-primary);display:grid;grid-template-columns:3.2em minmax(0, 1fr);align-items:center;gap:10px;min-height:50px;padding:5px 10px;border:1.75px solid var(--row-accent);border-left:12px solid var(--row-accent);border-radius:var(--radius-xs);background:var(--color-white);box-shadow:0 5px 10px rgba(0,0,0,.06)
}.unit-order{display:inline-flex;align-items:center;justify-content:center;width:2.55em;height:2.55em;min-width:2.55em;min-height:2.55em;border-radius:50%;background:var(--row-accent);color:var(--color-white);font-size:1.08rem;font-weight:950;line-height:1;letter-spacing:.02em;text-shadow:.35px 0 0 currentColor;box-shadow:inset 0 0 0 1px rgba(0,0,0,.14)
}.unit-warning{margin-top:10px;padding:10px 10px;border:1.5px solid #e8383d;border-radius:var(--radius-xs);background:#fff1f1;color:#b00020;font-size:.88rem;font-weight:900;line-height:1.45;text-align:center
}.unit-preview{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:10px
}.unit-producer-label{display:inline-grid;grid-template-columns:4em minmax(0, 180px) auto;align-items:center;gap:5px;min-width:0;margin-right:auto;color:var(--color-text);font-size:.85rem;font-weight:900;white-space:nowrap
}.unit-producer-unit{color:var(--color-text);font-size:.86rem;font-weight:900
}.unit-producer-input{min-height:30px;padding:5px 10px;border-width:1.5px;border-radius:10px;font-size:.85rem;font-weight:900
}.unit-button-group{display:inline-flex;align-items:center;justify-content:flex-end;gap:10px;flex-shrink:0
}.unit-copy-btn,
.unit-save-btn{min-width:5.8em;border:1.5px solid var(--color-primary);background:var(--color-white);color:var(--color-text)
}.unit-copy-btn:hover,
.unit-save-btn:hover{background:var(--color-primary);color:var(--color-white);transform:translateY(-1px)
}.unit-copy-btn:disabled,
.unit-save-btn:disabled{cursor:not-allowed;opacity:.45;background:#eee;color:#777;transform:none
}.unit-empty,
.unit-error{padding:25px 15px;border:1.75px solid var(--color-primary);border-radius:var(--radius-xs);background:var(--color-white);color:var(--color-text);font-weight:900;text-align:center;line-height:1.6
}@media (max-width: 768px){.unit-wrap{padding:10px 10px 20px
    }.main-title{margin:10px 0 10px;letter-spacing:.08em
    }.title-up{font-size:clamp(1.55rem, 7vw, 2.15rem)
    }.title-up span{padding:5px 20px
    }.title-dw{font-size:clamp(1rem, 4.5vw, 1.35rem)
    }.unit-card-title{padding:10px;font-size:18px
    }.unit-body,
    .unit-control-block,
    .unit-result-block{padding:10px
    }.unit-control-block{margin-bottom:10px
    }.unit-controls{grid-template-columns:1fr;gap:10px
    }.unit-control-item{grid-template-columns:4.7em minmax(0, 1fr);gap:5px
    }.unit-row{grid-template-columns:2.7em minmax(0, 1fr);gap:5px;min-height:45px;padding:5px 5px;border-left-width:10px
    }.unit-order{width:2.35em;height:2.35em;min-width:2.35em;min-height:2.35em;font-size:1rem
    }.unit-member-select{min-height:35px;padding:5px 5px;font-size:.82rem
    }.unit-reset-btn{min-width:4.8em;min-height:30px;padding:5px 10px;font-size:.8rem
    }.unit-output-title{padding-left:4.8em;font-size:1.08rem
    }.unit-preview{align-items:center;gap:5px
    }.unit-producer-label{grid-template-columns:4em minmax(0, 110px) auto;column-gap:5px;font-size:.8rem
    }.unit-producer-input{min-height:30px;padding:5px 10px;font-size:.8rem
    }.unit-producer-unit{font-size:.8rem
    }.unit-button-group{gap:5px
    }.unit-copy-btn,
    .unit-save-btn{min-width:5.2em;min-height:30px;padding:5px 10px;font-size:.8rem
    }.unit-guide-card{margin-top:10px
    }.unit-guide-body,
    .unit-guide-section{padding:10px
    }.unit-guide-body,
    .unit-guide-grid{gap:10px
    }.unit-guide-grid{grid-template-columns:1fr
    }.unit-guide-section-title{margin-bottom:10px;padding:5px 10px;font-size:.94rem
    }.unit-guide-text,
    .unit-guide-list{font-size:.84rem;line-height:1.58
    }

}