/* StudyLand Studio — local-only appearance editor. No Supabase writes. */
/* Không làm mờ ảnh hoặc GIF nền: background media vẫn fit cover theo mặc định. */
.bg-overlay { background:transparent !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important; }
.sidebar,.topbar,.card,.gate,.todo-v31-head { backdrop-filter:none !important; -webkit-backdrop-filter:none !important; }
body.studio-glass .sidebar{background:rgba(13,19,39,.21) !important; border-color:rgba(255,255,255,.42);box-shadow:none}
body.studio-glass .topbar{background:rgba(12,19,43,.14) !important;border-color:rgba(255,255,255,.4);box-shadow:none}
body.studio-glass .hero,body.studio-glass .todo-v31-head,body.studio-glass .card{
 background:rgba(9,19,42,.10) !important;background-image:none !important;box-shadow:none !important;
 border:1px solid rgba(255,255,255,.57) !important;color:#f7faff;
 text-shadow:0 1px 5px rgba(0,0,0,.7);
}
body.studio-glass .card .muted,body.studio-glass .card small,body.studio-glass .card label,body.studio-glass .topbar .muted,
body.studio-glass .todo-v31-head .muted {color:rgba(255,255,255,.88)}
body.studio-glass .topbar{color:#fff;text-shadow:0 1px 6px rgba(0,0,0,.75)}
body.studio-glass #nav button{background:rgba(255,255,255,.12);color:#fff;box-shadow:none;}
body.studio-glass #nav button.active{background:rgba(71,125,87,.45);}
body.studio-glass :is(.pill,.profile-pill){background:rgba(15,24,45,.16);border:1px solid rgba(255,255,255,.55);color:#fff}
body.studio-glass :is(.rule-box,.todo-empty,.todo-item,.habit-item,.session-item,.post-item,.event-item,.shop-item,.day-column,.todo-history-chip){
 background:rgba(20,33,57,.13);border-color:rgba(255,255,255,.5);color:#f7faff;
}
/* Form vẫn có nền nhẹ cho khả năng đọc; có thể chọn từng ô để làm trong suốt thêm. */
body.studio-glass .page :is(input:not([type="color"]):not([type="range"]),select,textarea,.upload-zone){background:rgba(255,255,255,.77);color:#24302a;text-shadow:none}
body.studio-glass .page :is(.btn,.filters button,.segmented button,.icon-btn){text-shadow:none}
body.studio-glass .world-canvas{background:linear-gradient(#b9d8e8 0 48%,#9bc181 48% 100%)}
/* Tùy chỉnh chính xác từng thành phần có độ ưu tiên cao hơn preset: lớp runtime ở cuối file riêng. */
#studioLauncher{position:fixed;bottom:19px;right:19px;z-index:80;border:1px solid rgba(255,255,255,.7);background:#213c38;color:#fff;border-radius:999px;padding:12px 17px;box-shadow:0 7px 25px rgba(0,0,0,.3);font-size:14px;font-weight:850;cursor:pointer}
#studioLauncher:focus-visible,#studioPanel button:focus-visible,#studioPanel input:focus-visible{outline:3px solid #63b6fb;outline-offset:2px}
#studioPanel{position:fixed;right:12px;top:12px;bottom:12px;width:min(380px,calc(100vw - 24px));z-index:82;background:#fbfcfa;color:#20302a;border:1px solid #cbd6cb;border-radius:22px;box-shadow:0 16px 70px rgba(0,0,0,.42);display:flex;flex-direction:column;font:14px/1.5 Inter,system-ui,Arial,sans-serif;text-shadow:none!important;isolation:isolate}
#studioPanel[hidden],#studioLauncher[hidden]{display:none!important}
#studioPanel *{box-sizing:border-box;font-family:inherit;text-shadow:none!important}
#studioPanel .studio-head{padding:16px 17px 12px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #e0e6df;gap:12px}
#studioPanel h2{font-size:18px;line-height:1.3;margin:0;color:#20302a}
#studioPanel .studio-scroll{padding:14px 17px 20px;overflow:auto;flex:1;display:flex;flex-direction:column;gap:14px}
#studioPanel .studio-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
#studioPanel .studio-actions.three{grid-template-columns:repeat(3,minmax(0,1fr))}
#studioPanel button{padding:9px 10px;border:1px solid #d1ddd1;background:#f1f6f0;border-radius:10px;cursor:pointer;color:#20302a;font-size:12px;font-weight:750}
#studioPanel .studio-primary{background:#50775a;color:#fff;border-color:#50775a}
#studioPanel .studio-danger{color:#904748;background:#fff4f2}
#studioPanel .studio-section{border:1px solid #e1e8e0;border-radius:13px;padding:12px;display:flex;flex-direction:column;gap:10px}
#studioPanel .studio-section h3{margin:0;font-size:14px;color:#20302a}
#studioPanel label{display:flex;flex-direction:column;gap:5px;color:#34483a;font-weight:700;font-size:12px}
#studioPanel .studio-cols{display:grid;grid-template-columns:1fr 1fr;gap:10px}
#studioPanel input:not([type=checkbox]),#studioPanel select{width:100%;min-height:34px;font-size:13px;padding:5px 8px;background:#fff;color:#20302a;border:1px solid #bcccbc;border-radius:8px;box-shadow:none;outline-offset:2px}
#studioPanel input[type=color]{min-height:36px;padding:3px}
#studioPanel input[type=range]{padding:0;min-height:20px;accent-color:#50775a}
#studioPanel .studio-switch{display:flex;flex-direction:row;align-items:center;gap:8px;cursor:pointer;font-size:13px}
#studioPanel .studio-switch input{width:17px;height:17px;accent-color:#50775a}
#studioPanel .studio-hint{font-size:11px;color:#64726a;margin:0;line-height:1.45}
#studioSelectedName{font-size:12px;line-height:1.45;padding:10px;background:#eef5ee;color:#2b4534;border-radius:10px;overflow-wrap:anywhere}
body.studio-picking{cursor:crosshair!important}
body.studio-picking :not(#studioPanel):not(#studioPanel *):not(#studioLauncher):not(#studioLauncher *){cursor:crosshair!important}
.studio-hover{outline:3px dashed #ffd66f!important;outline-offset:3px!important}
.studio-selected{outline:2px solid #8ef2f1!important;outline-offset:2px!important}
body.studio-picking #studioPanel{pointer-events:auto}
@media(max-width:680px){#studioPanel{top:8px;bottom:8px;right:8px;width:min(355px,calc(100vw - 16px))}#studioLauncher{right:10px;bottom:10px}}

/* Preview riêng, không bị các tùy chỉnh thành phần ngoài Studio tác động. */
#studioPanel .studio-font-preview{display:flex;flex-direction:column;gap:6px;padding:11px 12px;border-radius:12px;background:#f7f5ef;border:1px solid #dedfd4;min-height:115px}
#studioPanel .studio-preview-caption{font:700 11px/1.3 system-ui,Arial,sans-serif;color:#607366}
#studioPanel #studioFontPreviewText{font-size:23px;line-height:1.5;color:#253e31;overflow-wrap:anywhere;letter-spacing:normal;font-weight:400}
#studioPanel #studioFontLoadHint{font:400 11px/1.45 system-ui,Arial,sans-serif;color:#697d72}
