/* She Is Studio · editor */
.se-head { padding: 54px 0 22px; } body.aes .se-head h1 { font-size: clamp(40px, 5.4vw, 70px); margin: 14px 0 10px; }
.se-head .lead { max-width: 640px; }
.se-wrap { padding: 0 0 90px; }
.se { display: grid; grid-template-columns: 290px minmax(0, 1fr) 310px; gap: 18px; align-items: start; position: relative; }
@media (max-width: 1180px) { .se { grid-template-columns: 270px minmax(0, 1fr); } .se-right { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 12px; } }
@media (max-width: 760px) { .se { grid-template-columns: 1fr; } .se-mid { order: -1; } }
.se-left, .se-right { display: grid; gap: 12px; }
.se-box { background: #fff; border-radius: 22px; padding: 16px; box-shadow: 0 0 0 1px rgba(17,17,17,.07); display: grid; gap: 10px; align-content: start; }
.se-k { font: 500 11px "JetBrains Mono", monospace; letter-spacing: .1em; text-transform: uppercase; color: #6B6661; }
.se-box label { display: grid; gap: 5px; font: 600 12px Inter, sans-serif; color: #111; }
.se-box input:not([type=range]):not([type=color]), .se-box select, .se-box textarea { width: 100%; border: 1px solid rgba(17,17,17,.1); background: #F7F4EF; border-radius: 12px; padding: 10px 12px; font: 400 14px Inter, sans-serif; color: #111; outline: none; resize: vertical; }
.se-box input:focus, .se-box select:focus, .se-box textarea:focus { border-color: #E59AB9; box-shadow: 0 0 0 3px #FBE3EC; background: #fff; }
.se-box input[type=color] { width: 100%; height: 38px; border: 0; border-radius: 10px; padding: 0; background: none; cursor: pointer; }
.se-box input[type=range] { width: 100%; accent-color: #111; }
.se-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; } .se-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.se-row { display: flex; flex-wrap: wrap; gap: 6px; }
.se-row button, .se-seg button, .se-pages button { border: 0; border-radius: 999px; padding: 9px 13px; background: #F7F4EF; box-shadow: 0 0 0 1px rgba(17,17,17,.08); font: 600 12.5px Inter, sans-serif; color: #111; cursor: pointer; transition: background .2s; }
.se-row button:hover, .se-seg button:hover { background: #FBE3EC; }
.se-row button.on, .se-seg button.on, .se-row button.dark { background: #111; color: #F7F4EF; box-shadow: none; }
.se-seg { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.se-ups { display: grid; gap: 8px; }
.se-up { border: 1.5px dashed rgba(17,17,17,.2); background: #FBF8F4; border-radius: 16px; padding: 14px; text-align: left; cursor: pointer; display: grid; gap: 2px; font: 600 14px Inter, sans-serif; color: #111; transition: border-color .2s, background .2s; }
.se-up:hover { border-color: #E59AB9; background: #FDF0F4; } .se-up b { font: 400 22px "Instrument Serif", serif; } .se-up small { color: #6B6661; font-weight: 500; }
.se-tpls { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.se-tpls button { aspect-ratio: 4/5; border: 0; border-radius: 12px; cursor: pointer; display: grid; place-items: center; align-content: center; gap: 2px; box-shadow: 0 0 0 1px rgba(17,17,17,.08); transition: transform .2s; }
.se-tpls button:hover { transform: translateY(-2px); } .se-tpls button.on { box-shadow: 0 0 0 2px #fff, 0 0 0 4px #111; }
.se-tpls b { font: 400 24px/1 "Instrument Serif", serif; } .se-tpls small { font: 600 9px Inter, sans-serif; color: rgba(17,17,17,.6); background: rgba(255,255,255,.7); padding: 2px 5px; border-radius: 5px; }
.se-mid { display: grid; gap: 12px; position: sticky; top: 84px; }
.se-stage { position: relative; width: min(100%, 560px, calc(74vh * var(--ar, .8))); margin: 0 auto; border-radius: 18px; overflow: hidden; box-shadow: 0 0 0 1px rgba(17,17,17,.08), 0 30px 60px -24px rgba(17,17,17,.3); background: #EDE8E1; }
.se-stage canvas { display: block; width: 100%; height: 100%; touch-action: none; cursor: grab; }
.se-pages { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; align-items: center; } .se-pages > div { display: flex; flex-wrap: wrap; gap: 6px; }
.se-pages button { min-width: 38px; } .se-pages button.on { background: #111; color: #F7F4EF; }
.se-go { border: 0; border-radius: 999px; padding: 14px; background: #111; color: #F7F4EF; font: 600 14.5px Inter, sans-serif; cursor: pointer; } .se-go:disabled { opacity: .6; }
.se-ai { background: linear-gradient(160deg, #FDF0F4, #fff); }
.se-hint { margin: 0; color: #6B6661; font-size: 12.5px; line-height: 1.5; } .se-hint a { color: #111; font-weight: 700; }
.se-link { border: 0; background: none; color: #6B6661; font: 500 12.5px Inter, sans-serif; text-decoration: underline; cursor: pointer; justify-self: start; padding: 0; }
.se-toast { position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%); background: #111; color: #F7F4EF; padding: 12px 18px; border-radius: 14px; font: 500 14px Inter, sans-serif; z-index: 60; max-width: min(520px, 92vw); text-align: center; box-shadow: 0 18px 40px rgba(17,17,17,.3); }
.se-toast[hidden] { display: none; }
