/* Generator Kalender: gaya khusus tools ini. Token & font dari index.css (MIG UI v1).
   Font desain kalender (Poppins, Montserrat, dll) diatur di dalam SVG, bukan di sini. */
/* Sengaja tanpa class mig-base: aturan ".mig-base svg" (ikon 22px) akan mengecilkan SVG kalender. */
*{box-sizing:border-box}
body{margin:0;display:flex;min-height:100vh;background:var(--color-page);color:var(--color-ink);font-family:var(--font-sans);font-size:14px;line-height:1.45;font-variant-numeric:tabular-nums}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--color-brand);outline-offset:2px}
aside{width:360px;flex:none;background:var(--color-surface);padding:24px 20px;display:flex;flex-direction:column;gap:16px;overflow-y:auto;height:100vh;position:sticky;top:0;scrollbar-width:none}
aside::-webkit-scrollbar{display:none}
h1{margin:0;font-size:22px;font-weight:700}
.sub{margin:0;font-size:12px;color:var(--color-muted);line-height:1.5}
label,.lb{font-size:14px;font-weight:500;display:block;margin-bottom:6px}
input[type=number],input[type=text],select,textarea{width:100%;min-height:var(--control-h);border:1.5px solid var(--color-line);border-radius:var(--radius-pill);padding:0 18px;font:inherit;font-size:14px;background:var(--color-surface);color:var(--color-ink)}
input[type=number]:focus,input[type=text]:focus,select:focus,textarea:focus{outline:none;border-color:var(--color-brand);box-shadow:0 0 0 3px rgba(123,41,186,.15)}
select{appearance:none;-webkit-appearance:none;padding-right:44px;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%231c1b1a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 18px center}
textarea{min-height:72px;padding:12px 20px;border-radius:var(--radius-card);resize:vertical}
input[type=range]{width:100%;accent-color:var(--color-brand)}
input[type=color]{width:100%;height:var(--control-h);border:1.5px solid var(--color-line);border-radius:var(--radius-pill);padding:4px 8px;background:var(--color-surface);cursor:pointer}
.row{display:flex;gap:8px}.row>*{flex:1;min-width:0}
.chk{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:500;min-height:var(--control-h);margin:0;cursor:pointer}
.chk input{width:18px;height:18px;accent-color:var(--color-brand)}
.grp{border-top:1.5px solid var(--color-line);padding-top:16px;display:flex;flex-direction:column;gap:12px}
.val{font-weight:500;color:var(--color-muted)}
.note{font-size:12px;color:var(--color-muted);line-height:1.45}
button{min-height:var(--control-h);padding:0 20px;border:0;border-radius:var(--radius-pill);background:var(--color-brand);color:#fff;font:inherit;font-size:14px;font-weight:600;cursor:pointer;transition:background-color .15s;white-space:nowrap}
button:hover{background:var(--color-brand-hover)}
.alt{background:var(--color-surface);color:var(--color-ink);box-shadow:inset 0 0 0 1.5px var(--color-line)}
.alt:hover{background:var(--color-brand-soft)}
main{flex:1;min-width:0;padding:24px;overflow:auto}
.cap{font-size:12px;color:var(--color-muted);margin-bottom:12px}
.wrap{background:#fff;outline:1.5px dashed var(--color-line);outline-offset:6px;overflow:hidden}
.sheet{transform-origin:0 0;background:#fff}
.c{position:relative}
@media print{
aside,.cap{display:none}
body{display:block;background:none}
main{padding:0;overflow:visible}
.wrap{width:auto!important;height:auto!important;outline:none;overflow:visible}
.sheet{transform:none!important;background:none}
*{-webkit-print-color-adjust:exact;print-color-adjust:exact}
}
@media (max-width:820px){body{flex-direction:column}aside{width:auto;height:auto;position:static}}
@media (prefers-reduced-motion:reduce){button{transition:none}}
.back{align-self:flex-start;display:inline-flex;align-items:center;min-height:32px;padding:0 14px;border-radius:var(--radius-pill);background:var(--color-page);color:var(--color-ink);font-size:13px;font-weight:600;text-decoration:none}
.back:hover{background:var(--color-brand-soft);color:var(--color-brand)}
