/* Estudo 2.0: one compact language for teacher and student flows. */
.study-workspace,
.teacher-study-workspace {
    width: min(1180px, calc(100% - 32px));
    margin: 0 auto;
}

.study-page-hero .teacher-hero-row,
.study-workspace-heading {
    align-items: center;
}

.study-workspace-heading,
.study-view-heading,
.study-now-toolbar,
.study-compact-item > summary,
.teacher-study-item > summary,
.study-history-period > summary,
.study-archived-list > summary,
.study-completed-library > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.study-workspace-heading {
    margin-bottom: 12px;
}

.study-workspace-heading h2,
.study-view-heading h2 {
    margin: 2px 0 0;
}

.study-view-tabs {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    padding: 5px;
    margin: 0 0 16px;
    border: 1px solid var(--line);
    border-radius: 15px;
    background: rgba(15, 17, 21, 0.88);
}

.study-view-tabs a {
    min-height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border-radius: 11px;
    color: var(--muted);
    text-decoration: none;
    font-weight: 800;
    transition: color 160ms ease, background 160ms ease, transform 160ms ease;
}

.study-view-tabs .nav-icon {
    flex: 0 0 1rem;
}

.study-view-tabs a:hover {
    color: var(--text);
    transform: translateY(-1px);
}

.study-view-tabs a.is-active {
    color: var(--on-gold);
    background: var(--gold);
}

.study-view-tabs a small {
    min-width: 22px;
    padding: 1px 6px;
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.14);
    text-align: center;
}

.study-view-panel {
    scroll-margin-top: 94px;
}

.study-view-heading {
    margin: 2px 0 14px;
}

.study-view-heading > small {
    color: var(--muted);
}

.study-practice-action {
    white-space: nowrap;
}

.study-guidance,
.study-now-toolbar,
.study-quick-add,
.study-use-material,
.study-friendly-empty,
.study-archived-list {
    border-radius: 15px;
}

.study-now-toolbar,
.study-quick-add,
.study-friendly-empty {
    overflow: clip;
}

.study-workspace input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="hidden"]),
.study-workspace select,
.study-workspace textarea,
.teacher-study-workspace input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not([type="hidden"]),
.teacher-study-workspace select,
.teacher-study-workspace textarea {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    min-height: 2.55rem;
    padding: .62rem .72rem;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--bg);
    color: var(--text);
    font: inherit;
}

.study-workspace textarea,
.teacher-study-workspace textarea {
    min-height: 4.4rem;
    resize: vertical;
}

.study-workspace input::placeholder,
.study-workspace textarea::placeholder,
.teacher-study-workspace input::placeholder,
.teacher-study-workspace textarea::placeholder {
    color: color-mix(in srgb, var(--muted) 78%, transparent);
    opacity: 1;
}

.study-workspace input:focus,
.study-workspace select:focus,
.study-workspace textarea:focus,
.teacher-study-workspace input:focus,
.teacher-study-workspace select:focus,
.teacher-study-workspace textarea:focus {
    border-color: color-mix(in srgb, var(--gold) 68%, var(--line));
    outline: 2px solid color-mix(in srgb, var(--gold) 24%, transparent);
    outline-offset: 1px;
}

.study-workspace input[type="checkbox"],
.teacher-study-workspace input[type="checkbox"] {
    width: 1.05rem;
    height: 1.05rem;
    flex: 0 0 1.05rem;
    accent-color: var(--gold);
}

.study-quick-add {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: 10px;
    padding: 12px;
    margin-bottom: 14px;
}

.study-quick-add > input,
.study-quick-add > div input {
    width: 100%;
}

.study-plan-quick-add {
    grid-template-columns: minmax(220px, 1.5fr) minmax(150px, .8fr) auto auto;
}

.study-plan-quick-add > div,
.study-use-material form {
    display: grid;
    gap: 5px;
}

.study-plan-composer {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(260px, .8fr);
    gap: 12px;
    align-items: stretch;
    margin-bottom: 16px;
}

.study-plan-composer > .study-quick-add {
    margin-bottom: 0;
}

.study-use-material {
    padding: 0;
    overflow: clip;
}

.study-use-material > summary,
.study-inline-details > summary {
    cursor: pointer;
    list-style: none;
}

.study-use-material > summary {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 14px;
}

.study-use-material > summary span:first-child,
.study-archived-list > summary span:first-child {
    display: grid;
    gap: 2px;
}

.study-use-material > summary small,
.study-archived-list > summary small {
    color: var(--muted);
    font-weight: 500;
}

.study-use-material form {
    padding: 0 14px 14px;
}

.study-compact-check {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    white-space: nowrap;
    font-size: .9rem;
}

.study-compact-groups,
.teacher-study-groups {
    display: grid;
    gap: 16px;
}

.study-compact-group > h3,
.teacher-study-group > h3 {
    margin: 0 0 7px;
    color: var(--gold-strong);
    font-size: .78rem;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.study-compact-list,
.teacher-study-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.study-compact-item,
.teacher-study-item {
    min-width: 0;
    border: 1px solid var(--line);
    border-radius: 13px;
    background: rgba(15, 17, 21, .9);
    overflow: clip;
}

.study-compact-item > summary,
.teacher-study-item > summary {
    display: grid;
    grid-template-columns: 8px minmax(0, 1fr);
    min-height: 56px;
    padding: 9px 11px;
    cursor: pointer;
    list-style: none;
}

.study-compact-item > summary > .summary-progress,
.teacher-study-item > summary > .summary-progress {
    grid-column: 2 / -1;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 7px;
    width: 100%;
    min-width: 0;
    max-width: none;
    margin-top: 2px;
}

.study-compact-item > summary > .summary-progress > span,
.teacher-study-item > summary > .summary-progress > span {
    grid-column: 2;
    grid-row: 1;
}

.study-compact-item > summary > .summary-progress > .duo-progress,
.teacher-study-item > summary > .summary-progress > .duo-progress {
    grid-column: 1;
    grid-row: 1;
    width: 100%;
}

.study-compact-item > summary::-webkit-details-marker,
.teacher-study-item > summary::-webkit-details-marker,
.study-history-period > summary::-webkit-details-marker,
.study-use-material > summary::-webkit-details-marker,
.study-inline-details > summary::-webkit-details-marker,
.study-archived-list > summary::-webkit-details-marker,
.study-completed-library > summary::-webkit-details-marker {
    display: none;
}

.study-compact-chevron {
    width: 8px;
    height: 8px;
    flex: 0 0 8px;
    border-right: 2px solid var(--gold);
    border-bottom: 2px solid var(--gold);
    transform: rotate(-45deg);
    transition: transform 160ms ease;
}

details[open] > summary .study-compact-chevron {
    transform: rotate(45deg) translate(-1px, -1px);
}

.study-compact-copy,
.teacher-study-item > summary > span:nth-child(2) {
    min-width: 0;
    display: grid;
    gap: 2px;
    flex: 1;
}

.study-compact-copy strong,
.teacher-study-item > summary strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.study-compact-copy small,
.teacher-study-item > summary small {
    color: var(--muted);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.study-kind-label {
    color: var(--green) !important;
}

.study-compact-body,
.teacher-study-item-body {
    display: grid;
    gap: 11px;
    padding: 10px 12px 12px;
    border-top: 1px solid var(--line);
}

.study-compact-body > p,
.teacher-study-item-body > p,
.study-orientation p {
    margin: 0;
    color: var(--muted);
}

.study-orientation {
    display: grid;
    gap: 4px;
}

.study-friendly-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    min-height: 130px;
    padding: 18px;
    text-align: left;
}

.study-friendly-empty p {
    margin: 3px 0 0;
    color: var(--muted);
}

.study-now-toolbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    padding: 12px 14px;
    margin-bottom: 10px;
}

.study-now-toolbar > div {
    display: grid;
    gap: 1px;
}

.study-now-toolbar small {
    color: var(--muted);
}

.study-inline-details {
    min-width: min(360px, 100%);
}

.study-inline-details > summary {
    color: var(--gold-strong);
    font-weight: 800;
    text-align: right;
}

.study-inline-details form,
.study-now-edit {
    display: grid;
    gap: 8px;
    padding-top: 10px;
}

.study-message-open {
    display: none;
}

.study-message-details > summary {
    display: inline-flex;
    align-items: center;
    width: max-content;
    max-width: 100%;
}

.study-message-details[open] {
    grid-column: 1 / -1;
    width: 100%;
    min-width: 0;
}

.study-message-details[open] > summary {
    width: max-content;
    max-width: 100%;
    justify-self: start;
    padding-top: 10px;
    text-align: left;
}

.study-message-details[open] .study-message-closed {
    display: none;
}

.study-message-details[open] .study-message-open {
    display: inline;
}

.study-message-details form {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
}

.study-message-details textarea {
    min-height: 3.35rem;
}

.study-message-details .button {
    min-height: 3.35rem;
    min-width: 110px;
}

.study-unit-selector {
    min-width: 0;
    margin: 0;
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: 12px;
}

.study-unit-selector legend {
    padding: 0 5px;
    color: var(--muted);
    font-size: .82rem;
}

.study-unit-check-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 5px 8px;
    max-height: 280px;
    overflow: auto;
}

.study-unit-check-grid label {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 7px;
    min-height: 34px;
    padding: 5px 7px;
    border-radius: 8px;
    background: rgba(255, 255, 255, .035);
    font-size: .86rem;
}

.study-unit-check-grid label span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.study-row-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
}

.teacher-study-item.is-paused {
    opacity: .72;
}

.study-history-simple {
    display: grid;
    gap: 9px;
}

.study-history-controls {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    margin-bottom: 10px;
}

.study-history-controls > a,
.study-history-controls > details > summary {
    min-height: 34px;
    padding: 7px 11px;
    border: 1px solid var(--line);
    border-radius: 999px;
    color: var(--muted);
    font-size: .82rem;
    font-weight: 800;
    text-decoration: none;
    cursor: pointer;
    list-style: none;
}

.study-history-controls > a.is-active {
    border-color: var(--gold);
    color: var(--gold-strong);
    background: rgba(255, 184, 0, .08);
}

.study-history-controls > details {
    position: relative;
}

.study-history-controls > details > summary::-webkit-details-marker {
    display: none;
}

.study-history-controls > details > form {
    position: absolute;
    right: 0;
    z-index: 8;
    display: flex;
    gap: 7px;
    width: max-content;
    max-width: min(92vw, 360px);
    padding: 9px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--panel-strong, #111418);
    box-shadow: var(--shadow-soft);
}

.study-history-controls select {
    min-width: 160px;
}

.study-history-period {
    padding: 0;
    overflow: clip;
}

.study-history-period > summary,
.study-archived-list > summary {
    padding: 13px 15px;
    cursor: pointer;
    list-style: none;
}

.study-history-period > summary > span:first-child {
    display: grid;
}

.study-history-period > summary small {
    color: var(--muted);
}

.study-history-period-body {
    display: grid;
    gap: 13px;
    padding: 13px 15px 15px;
    border-top: 1px solid var(--line);
}

.study-history-period-body section {
    display: grid;
    gap: 5px;
}

.study-history-period-body h3 {
    margin: 0;
    color: var(--gold-strong);
    font-size: .78rem;
    text-transform: uppercase;
}

.study-history-period-body article,
.study-archived-list article {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-height: 42px;
    padding: 7px 0;
    border-bottom: 1px solid rgba(247, 248, 250, .08);
}

.study-history-period-body article > div,
.study-archived-list article > span {
    display: grid;
}

.study-history-period-body article small,
.study-archived-list article small {
    color: var(--muted);
}

.study-history-guidance {
    margin: 0;
    color: var(--muted);
}

.study-history-section-title {
    margin: 0 !important;
    color: var(--text) !important;
    font-size: .9rem !important;
    letter-spacing: 0;
    text-transform: none !important;
}

.study-history-secondary {
    overflow: clip;
    border: 1px solid rgba(247, 248, 250, .08);
    border-radius: 10px;
    background: rgba(255, 255, 255, .018);
}

.study-history-secondary > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 38px;
    padding: 8px 10px;
    color: var(--muted);
    cursor: pointer;
    font-size: .82rem;
    font-weight: 800;
    list-style: none;
}

.study-history-secondary > summary::-webkit-details-marker {
    display: none;
}

.study-history-secondary > article,
.study-history-secondary > .weekly-attachment-gallery {
    margin-inline: 10px;
}

.study-history-event:first-of-type {
    border-top: 1px solid rgba(247, 248, 250, .08);
}

.study-archived-list {
    margin-top: 14px;
}

.study-archived-list > div {
    padding: 0 14px 12px;
}

.study-completed-library {
    margin-top: 12px;
    padding: 0;
    overflow: clip;
}

.study-completed-library > summary {
    padding: 13px 15px;
    cursor: pointer;
    list-style: none;
}

.study-completed-library > summary > span:first-child,
.study-completed-library article {
    display: grid;
}

.study-completed-library > summary small,
.study-completed-library article small {
    color: var(--muted);
}

.study-completed-library > div {
    display: grid;
    gap: 12px;
    padding: 0 15px 15px;
    border-top: 1px solid var(--line);
}

.study-completed-library section {
    display: grid;
    gap: 5px;
}

.study-completed-library h3 {
    margin: 13px 0 0;
    color: var(--gold-strong);
    font-size: .78rem;
    text-transform: uppercase;
}

.study-completed-library article {
    gap: 2px;
    padding: 7px 0;
    border-bottom: 1px solid rgba(247, 248, 250, .08);
}

.study-completed-library article > .study-row-actions {
    margin-top: 5px;
}

.study-content-done-mark {
    display: inline-grid;
    place-items: center;
    width: 28px;
    height: 28px;
    flex: 0 0 28px;
    border-radius: 50%;
    color: var(--green);
    background: color-mix(in srgb, var(--green) 12%, transparent);
    font-weight: 900;
}

.study-legacy-notes {
    min-width: 0;
    padding: 0;
    border: 1px solid rgba(247, 248, 250, .08);
    border-radius: 10px;
}

.study-legacy-notes > summary {
    padding: 9px 10px;
    text-align: left;
}

.study-legacy-notes > div {
    display: grid;
    gap: 8px;
    padding: 0 10px 10px;
}

.study-legacy-notes article {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: 8px;
}

.study-legacy-notes article > div,
.study-legacy-notes article > form:first-child {
    min-width: 0;
}

@media (max-width: 1100px) {
    .study-plan-composer,
    .study-plan-quick-add {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 900px) {

    .study-compact-list,
    .teacher-study-list {
        grid-template-columns: 1fr;
    }

    .study-unit-check-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .study-view-heading {
        display: grid;
        grid-template-columns: 1fr;
        align-items: flex-start;
    }

    .study-view-heading > .button {
        width: 100%;
    }
}

@media (max-width: 600px) {
    .study-history-controls > details > form {
        right: auto;
        left: 0;
    }

    .study-workspace,
    .teacher-study-workspace {
        width: min(100% - 20px, 1180px);
    }

    .study-page-hero .teacher-hero-row {
        align-items: stretch;
    }

    .study-page-hero .study-practice-action {
        width: 100%;
    }

    .study-view-tabs {
        position: sticky;
        top: 62px;
        z-index: 5;
        gap: 3px;
    }

    .study-view-tabs a {
        gap: 5px;
        font-size: .86rem;
    }

    .study-view-tabs a small {
        display: none;
    }

    .study-now-toolbar {
        align-items: flex-start;
    }

    .study-now-toolbar {
        display: grid;
    }

    .study-inline-details {
        min-width: 0;
        width: 100%;
    }

    .study-inline-details > summary {
        text-align: left;
    }

    .study-message-details form {
        grid-template-columns: 1fr;
    }

    .study-message-details .button {
        width: 100%;
    }

    .study-quick-add {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .study-plan-quick-add {
        grid-template-columns: 1fr;
    }

    .study-unit-check-grid {
        grid-template-columns: 1fr;
        max-height: 240px;
    }

    .study-row-actions .button {
        min-height: 36px;
    }
}

/* Mantém o resumo do período alinhado mesmo após as regras legadas abaixo. */
.study-period-content-summary > article {
    align-items: center;
}

/* Study 4.0: one plan, one current highlight and one history. */
.study-view-tabs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.study-view-tabs a.is-active .nav-icon,
.study-view-tabs a.is-active .note-line-icon,
.study-view-tabs a.is-active .history-icon {
    color: var(--on-gold);
}

.study-compact-group > h3,
.teacher-study-group > h3 {
    display: flex;
    align-items: center;
    gap: 8px;
}

.study-area-icon {
    position: relative;
    display: inline-grid;
    place-items: center;
    width: 24px;
    height: 24px;
    flex: 0 0 24px;
    border-radius: 7px;
    color: var(--gold-strong);
    background: color-mix(in srgb, var(--gold) 12%, transparent);
}

.study-area-icon::before,
.study-area-icon::after {
    content: "";
    position: absolute;
}

.study-area-icon.is-method::before {
    width: 13px;
    height: 14px;
    border: 1.5px solid currentColor;
    border-radius: 2px 4px 4px 2px;
}

.study-area-icon.is-method::after {
    width: 1px;
    height: 12px;
    background: currentColor;
}

.study-area-icon.is-repertoire {
    color: #ff6f9f;
    background: transparent;
}

.study-area-icon.is-repertoire::before {
    content: "𝄞";
    position: static;
    font-family: Bravura, "Noto Music", serif;
    font-size: 22px;
    line-height: .82;
    transform: translateY(1px);
}

.study-area-icon.is-technique {
    color: #50d5b7;
    background: rgba(80, 213, 183, .12);
}

.study-area-icon.is-technique::before {
    width: 15px;
    height: 10px;
    border: 1.5px solid currentColor;
    border-radius: 2px;
    background: repeating-linear-gradient(90deg, transparent 0 3px, currentColor 3px 4px);
}

.study-area-icon.is-theory {
    color: #69aefc;
    background: rgba(105, 174, 252, .12);
}

.study-area-icon.is-theory::before,
.study-area-icon.is-reading::before {
    width: 12px;
    height: 15px;
    border: 1.5px solid currentColor;
    border-radius: 2px;
}

.study-area-icon.is-theory::after,
.study-area-icon.is-reading::after {
    width: 7px;
    height: 1px;
    box-shadow: 0 -3px 0 currentColor, 0 3px 0 currentColor;
    background: currentColor;
}

.study-area-icon.is-rhythm {
    color: #ff9861;
    background: rgba(255, 152, 97, .12);
}

.study-area-icon.is-rhythm::before {
    width: 12px;
    height: 14px;
    border: 1.5px solid currentColor;
    clip-path: polygon(50% 0, 100% 100%, 0 100%);
}

.study-area-icon.is-rhythm::after {
    width: 1.5px;
    height: 9px;
    background: currentColor;
    transform: rotate(14deg);
}

.study-area-icon.is-reading,
.study-area-icon.is-other {
    color: #b99cff;
    background: rgba(185, 156, 255, .12);
}

.study-area-icon.is-other::before {
    content: "♪";
    position: static;
    font-size: 17px;
}

.study-material-bank-icon,
.study-material-search-icon,
.study-new-material-icon {
    position: relative;
    display: inline-block;
}

.study-material-search-icon::before {
    content: "";
    position: absolute;
    top: 3px;
    left: 3px;
    width: 14px;
    height: 14px;
    border: 2px solid currentColor;
    border-radius: 50%;
}

.study-material-search-icon::after {
    content: "";
    position: absolute;
    right: 2px;
    bottom: 4px;
    width: 10px;
    height: 2px;
    border-radius: 999px;
    background: currentColor;
    transform: rotate(45deg);
    transform-origin: right center;
}

.study-material-bank-icon::before {
    content: "";
    position: absolute;
    inset: 7px 2px 3px;
    border: 2px solid currentColor;
    border-radius: 4px;
}

.study-material-bank-icon::after {
    content: "";
    position: absolute;
    top: 4px;
    left: 4px;
    width: 10px;
    height: 6px;
    border: 2px solid currentColor;
    border-bottom: 0;
    border-radius: 3px 3px 0 0;
}

.study-new-material-icon::before {
    content: "";
    position: absolute;
    inset: 2px 6px 2px 4px;
    border: 2px solid currentColor;
    border-radius: 3px;
}

.study-new-material-icon::after {
    content: "+";
    position: absolute;
    right: 0;
    bottom: -1px;
    display: grid;
    place-items: center;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    color: var(--on-gold);
    background: var(--gold);
    font: 900 13px/1 Arial, sans-serif;
}

.study-material-combobox {
    position: relative;
}

.study-material-results {
    position: absolute;
    z-index: 12;
    top: calc(100% + 6px);
    left: 0;
    right: 0;
    max-height: min(330px, 46dvh);
    padding: 6px;
    border: 1px solid color-mix(in srgb, var(--gold) 45%, var(--line));
    border-radius: 12px;
    background: #111418;
    box-shadow: 0 18px 48px rgba(0, 0, 0, .54);
    overflow-y: auto;
}

.study-material-results > button {
    width: 100%;
    min-height: 48px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 10px;
    border: 0;
    border-radius: 8px;
    color: var(--text);
    background: transparent;
    text-align: left;
    cursor: pointer;
}

.study-material-results > button > span {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.study-material-results > button strong,
.study-material-results > button small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.study-material-results > button small {
    color: var(--muted);
}

.study-material-results > button:hover,
.study-material-results > button.is-active {
    background: color-mix(in srgb, var(--gold) 10%, rgba(255, 255, 255, .035));
}

.study-material-results > button:disabled {
    opacity: .48;
    cursor: default;
}

.study-material-no-results {
    margin: 0;
    padding: 14px;
    color: var(--muted);
    text-align: center;
}

.study-current-contents {
    display: grid;
    gap: 7px;
}

.study-current-contents > strong {
    color: var(--gold-strong);
    font-size: .78rem;
    text-transform: uppercase;
}

.study-period-content-summary > article {
    align-items: center;
}

.study-period-content-summary > article > form,
.study-period-content-summary .study-content-done-mark {
    margin-left: auto;
}

.study-period-content-summary > article.is-completed > div > strong,
.study-content-manager-list > article.is-completed .study-content-row-copy strong {
    color: var(--muted);
    text-decoration: line-through;
}

.study-all-contents {
    border: 1px solid var(--line);
    border-radius: 10px;
    overflow: clip;
}

.study-all-contents > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 9px 11px;
    cursor: pointer;
    list-style: none;
    font-weight: 800;
}

.study-all-contents > .study-unit-summary {
    border: 0;
    border-top: 1px solid var(--line);
    border-radius: 0;
}

.study-progress-group {
    display: grid;
    gap: 9px;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 13px;
    background: rgba(7, 8, 10, .35);
}

.study-progress-group legend {
    padding: 0 5px;
    font-weight: 900;
}

.study-progress-group legend small {
    color: var(--muted);
    font-weight: 600;
}

.study-progress-group .study-switch-row {
    padding: 0;
    border: 0;
    background: transparent;
}

.study-progress-group .study-progress-options {
    padding-top: 9px;
    border-top: 1px solid var(--line);
}

.study-plan-status-actions {
    justify-content: flex-end;
}

.study-list-line-icon {
    width: 15px;
    height: 12px;
    border-top: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    box-shadow: inset 0 4px 0 transparent, 0 -4px 0 -3px currentColor;
}

.study-content-toolbar,
.study-bulk-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px;
}

.study-content-dialog-sticky {
    position: sticky;
    z-index: 5;
    top: -14px;
    display: grid;
    gap: 7px;
    margin: -14px -16px 0;
    padding: 12px 16px 9px;
    border-bottom: 1px solid var(--line);
    background: color-mix(in srgb, #111418 96%, transparent);
    box-shadow: 0 8px 18px rgba(0, 0, 0, .18);
}

.study-bulk-toolbar {
    padding: 8px;
    border: 1px solid color-mix(in srgb, var(--gold) 40%, var(--line));
    border-radius: 10px;
    background: #0d1014;
}

.study-bulk-highlight-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 5px;
}

.selection-mode-icon {
    position: relative;
    width: 13px;
    height: 13px;
    flex: 0 0 13px;
    border: 1.5px solid currentColor;
    border-radius: 3px;
}

[data-study-selection-toggle].is-cancel .selection-mode-icon {
    border: 0;
}

[data-study-selection-toggle].is-cancel .selection-mode-icon::before,
[data-study-selection-toggle].is-cancel .selection-mode-icon::after {
    position: absolute;
    top: 6px;
    left: 0;
    width: 14px;
    height: 1.5px;
    border-radius: 999px;
    background: currentColor;
    content: "";
    transform: rotate(45deg);
}

[data-study-selection-toggle].is-cancel .selection-mode-icon::after {
    transform: rotate(-45deg);
}

.study-content-manager-sections {
    display: grid;
    gap: 10px;
}

.study-content-manager-section {
    min-width: 0;
    overflow: clip;
    border: 1px solid rgba(247, 248, 250, .09);
    border-radius: 11px;
    background: rgba(255, 255, 255, .015);
}

.study-content-manager-section > header strong {
    color: var(--gold-strong);
    font-size: .82rem;
}

.study-content-manager-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 5px;
    padding: 6px;
}

.study-content-manager-list > article {
    min-width: 0;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) minmax(118px, auto) auto;
    align-items: center;
    gap: 7px;
    min-height: 42px;
    padding: 5px 6px 5px 9px;
    border: 1px solid rgba(247, 248, 250, .08);
    border-radius: 9px;
    background: rgba(255, 255, 255, .025);
}

.study-content-row-copy {
    min-width: 0;
    display: grid;
}

.study-content-row-copy strong,
.study-content-row-copy small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.study-content-row-copy small {
    color: var(--muted);
    font-size: .72rem;
}

.study-content-manager-list select {
    min-height: 32px !important;
    padding: 4px 24px 4px 7px !important;
    font-size: .78rem !important;
}

.study-period-state-field {
    min-width: 0;
}

.study-content-complete-button {
    min-width: 6.4rem;
    justify-content: center;
    padding-inline: 8px;
}

.study-content-complete-button.is-completed,
.study-content-done-mark {
    border-color: color-mix(in srgb, var(--green) 55%, var(--line));
    color: var(--green);
}

.study-content-done-mark {
    font-size: .76rem;
    font-weight: 850;
    white-space: nowrap;
}

.study-content-savebar {
    position: sticky;
    z-index: 5;
    bottom: -16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 0 -16px -16px;
    padding: 10px 16px;
    border-top: 1px solid var(--line);
    background: color-mix(in srgb, #111418 97%, transparent);
    box-shadow: 0 -9px 22px rgba(0, 0, 0, .28);
}

.study-content-savebar small {
    color: var(--muted);
}

.study-batch-selector {
    display: grid;
    place-items: center;
}

.study-content-toggle.is-completed {
    color: var(--green);
    border-color: color-mix(in srgb, var(--green) 55%, var(--line));
}

.study-ajax-feedback {
    position: fixed;
    z-index: 120;
    top: 76px;
    left: 50%;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    max-width: min(92vw, 440px);
    padding: 9px 13px;
    border: 1px solid color-mix(in srgb, var(--green) 50%, var(--line));
    border-radius: 10px;
    color: var(--text);
    background: #111418;
    box-shadow: 0 14px 38px rgba(0, 0, 0, .45);
    opacity: 0;
    pointer-events: none;
    transform: translate(-50%, -10px);
    transition: opacity 160ms ease, transform 160ms ease;
}

.study-ajax-feedback::before {
    display: inline-grid;
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
    place-items: center;
    border-radius: 999px;
    background: var(--green);
    color: #07110d;
    content: "✓";
    font-size: 13px;
    font-weight: 950;
    line-height: 1;
}

.study-ajax-feedback.is-visible {
    opacity: 1;
    transform: translate(-50%, 0);
}

.study-ajax-feedback.is-error {
    border-color: color-mix(in srgb, #ff6f86 60%, var(--line));
}

.study-ajax-feedback.is-error::before {
    background: #ff6f86;
    color: #160408;
    content: "!";
}

@media (max-width: 760px) {
    .study-content-manager-list {
        grid-template-columns: 1fr;
    }

    .study-content-manager-list > article {
        grid-template-columns: auto minmax(0, 1fr) auto;
    }

    .study-content-manager-list > article > .study-period-state-field {
        grid-column: 2;
    }

    .study-content-manager-list > article > form[data-study-content-toggle],
    .study-content-manager-list > article > .study-content-done-mark {
        grid-column: 3;
        grid-row: 1 / span 2;
    }

    .study-content-dialog-sticky {
        margin-inline: -12px;
        padding-inline: 12px;
    }

    .study-bulk-toolbar,
    .study-content-savebar {
        align-items: stretch;
        flex-direction: column;
    }

    .study-bulk-highlight-actions,
    .study-bulk-toolbar > form,
    .study-bulk-toolbar > form .button,
    .study-content-savebar .button {
        width: 100%;
    }

    .study-bulk-highlight-actions .button {
        flex: 1 1 8rem;
    }

    .study-content-savebar {
        margin-inline: -12px;
        padding-inline: 12px;
    }

    .study-plan-status-actions {
        justify-content: stretch;
    }

    .study-plan-status-actions form,
    .study-plan-status-actions .button {
        flex: 1;
    }
}

/* Study 3.0: plan, period target and history are separate without visual noise. */
.study-add-entry {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
    padding: 12px 14px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: rgba(15, 17, 21, .9);
    overflow: clip;
}

.study-add-entry p {
    margin: 0;
    color: var(--muted);
    font-size: .9rem;
}

.study-plan-wizard {
    width: min(760px, calc(100% - 28px));
    max-height: min(820px, calc(100dvh - 28px));
    padding: 0;
    border: 1px solid color-mix(in srgb, var(--gold) 40%, var(--line));
    border-radius: 18px;
    background: #111418;
    color: var(--text);
    box-shadow: 0 28px 90px rgba(0, 0, 0, .64);
    overflow: hidden;
}

.study-plan-wizard::backdrop {
    background: rgba(0, 0, 0, .76);
    backdrop-filter: blur(5px);
}

.study-plan-wizard > form {
    display: grid;
    grid-template-rows: auto 3px minmax(0, 1fr) auto;
    max-height: min(820px, calc(100dvh - 28px));
}

.study-wizard-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 16px 18px 13px;
}

.study-wizard-header h2 {
    margin: 3px 0 0;
    font-size: clamp(1.15rem, 3vw, 1.55rem);
}

.study-wizard-progress {
    background: rgba(255, 255, 255, .07);
    overflow: hidden;
}

.study-wizard-progress span {
    display: block;
    width: 16.66%;
    height: 100%;
    background: linear-gradient(90deg, var(--gold), var(--green));
    transition: width 180ms ease;
}

.study-wizard-step {
    min-height: 290px;
    padding: 22px 20px;
    overflow: auto;
}

.study-wizard-question {
    display: block;
    margin: 0 0 16px;
    font-size: clamp(1.1rem, 3vw, 1.35rem);
    font-weight: 900;
}

.study-choice-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.study-wizard-step[data-study-wizard-step="kind"] .study-choice-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.study-new-material-fields,
.study-new-list-fields {
    display: grid;
    gap: 10px;
}

.study-new-material-fields {
    grid-template-columns: minmax(0, 1.4fr) minmax(170px, .6fr);
}

.study-new-material-fields label,
.study-new-list-fields label {
    display: grid;
    gap: 5px;
    color: var(--muted);
    font-size: .84rem;
    font-weight: 800;
}

.study-new-list-fields {
    grid-template-columns: minmax(150px, 1fr) minmax(150px, 1fr) 90px 90px;
    margin-top: 14px;
}

.study-new-list-fields > small {
    grid-column: 1 / -1;
    color: var(--muted);
}

.study-choice-card {
    position: relative;
    min-width: 0;
    display: grid;
    justify-items: start;
    gap: 5px;
    min-height: 128px;
    padding: 16px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: rgba(7, 8, 10, .55);
    cursor: pointer;
    transition: border-color 150ms ease, background 150ms ease, transform 150ms ease;
}

.study-choice-grid-compact .study-choice-card {
    min-height: 100px;
}

.study-choice-card:hover {
    border-color: color-mix(in srgb, var(--gold) 60%, var(--line));
    transform: translateY(-1px);
}

.study-choice-card:has(input:checked) {
    border-color: var(--gold);
    background: color-mix(in srgb, var(--gold) 10%, rgba(7, 8, 10, .82));
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--gold) 32%, transparent);
}

.study-choice-card > input {
    position: absolute;
    top: 12px;
    right: 12px;
}

.study-choice-card small,
.study-wizard-hint,
.study-switch-row small,
.study-progress-options small {
    color: var(--muted);
}

.study-wizard-optional {
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid var(--line);
}

.study-wizard-optional > summary {
    width: max-content;
    color: var(--muted);
    cursor: pointer;
    font-weight: 800;
}

.study-wizard-optional > label {
    display: grid;
    gap: 6px;
    margin-top: 10px;
    color: var(--muted);
    font-size: .86rem;
    font-weight: 800;
}

.study-wizard-optional select {
    width: min(100%, 24rem);
}

.study-create-material-prompt {
    display: flex;
    width: 100%;
    min-height: 48px;
    align-items: center;
    gap: 11px;
    margin-top: 12px;
    padding: 10px 12px;
    border: 1px dashed color-mix(in srgb, var(--gold) 58%, var(--line));
    border-radius: 11px;
    background: color-mix(in srgb, var(--gold) 7%, transparent);
    color: var(--muted);
    cursor: pointer;
    font: inherit;
    text-align: left;
}

.study-create-material-prompt[hidden] {
    display: none;
}

.study-create-material-prompt:hover,
.study-create-material-prompt:focus-visible {
    border-color: var(--gold);
    color: var(--text);
}

.study-create-material-prompt .study-new-material-icon {
    width: 28px;
    height: 28px;
    flex: 0 0 28px;
    color: var(--gold);
}

.study-create-material-prompt strong {
    color: var(--gold);
}

.study-choice-icon {
    width: 28px;
    height: 28px;
    color: var(--gold);
}

.study-wizard-material-lists,
.study-wizard-material-list,
.study-period-picker {
    min-width: 0;
    margin-top: 14px;
}

.study-picker-toolbar,
.study-picker-section > summary,
.study-objective-contents > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.study-picker-section,
.study-objective-contents {
    margin-top: 7px;
    border: 1px solid var(--line);
    border-radius: 11px;
    background: rgba(7, 8, 10, .34);
    overflow: clip;
}

.study-picker-section > summary,
.study-objective-contents > summary {
    min-height: 42px;
    padding: 8px 11px;
    cursor: pointer;
    list-style: none;
}

.study-picker-section > summary::-webkit-details-marker,
.study-objective-contents > summary::-webkit-details-marker {
    display: none;
}

.study-picker-section > .study-unit-check-grid,
.study-objective-contents > .study-objective-unit-grid {
    padding: 7px;
    border-top: 1px solid var(--line);
}

.study-objective-section-list {
    display: grid;
    gap: 8px;
    padding: 8px;
    border-top: 1px solid var(--line);
}

.study-objective-section {
    min-width: 0;
    overflow: clip;
    border: 1px solid rgba(247, 248, 250, .08);
    border-radius: 10px;
    background: rgba(255, 255, 255, .018);
}

.study-objective-section > header,
.study-content-manager-section > header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-height: 40px;
    padding: 6px 8px 6px 11px;
    border-bottom: 1px solid rgba(247, 248, 250, .08);
}

.study-objective-section > .study-unit-check-grid {
    padding: 7px;
}

.study-switch-row {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: rgba(7, 8, 10, .48);
}

.study-switch-row > span {
    display: grid;
    gap: 2px;
}

.study-period-unit-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
    margin-top: 8px;
}

.study-period-unit-list > article {
    min-width: 0;
    padding: 7px 8px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: rgba(255, 255, 255, .025);
}

.study-period-unit-main {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 28px;
    cursor: pointer;
}

.study-period-unit-main span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.study-period-unit-options {
    display: grid;
    grid-template-columns: 105px minmax(0, 1fr);
    gap: 6px;
    margin-top: 6px;
}

.study-period-unit-options[hidden] {
    display: none;
}

.study-period-unit-options input,
.study-period-unit-options select {
    min-height: 36px !important;
    padding: 6px 8px !important;
    font-size: .82rem !important;
}

.study-progress-options {
    display: grid;
    gap: 8px;
    margin-top: 10px;
}

.study-progress-options > label {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    padding: 10px 12px;
    border: 1px solid var(--line);
    border-radius: 11px;
}

.study-progress-options > label > span {
    display: grid;
    gap: 2px;
}

.study-manual-progress {
    align-items: center !important;
}

.study-manual-progress input {
    width: 76px !important;
    margin-left: auto;
}

.study-wizard-actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 12px 18px;
    border-top: 1px solid var(--line);
    background: #111418;
}

.back-line-icon {
    position: relative;
    display: inline-block;
    width: 1rem;
    height: 1rem;
    flex: 0 0 1rem;
}

.back-line-icon::before {
    content: "";
    position: absolute;
    top: 0.2rem;
    left: 0.12rem;
    width: 0.54rem;
    height: 0.54rem;
    border-bottom: 2px solid currentColor;
    border-left: 2px solid currentColor;
    transform: rotate(45deg);
}

.back-line-icon::after {
    content: "";
    position: absolute;
    top: 0.47rem;
    left: 0.2rem;
    width: 0.7rem;
    height: 0.38rem;
    border-top: 2px solid currentColor;
    border-right: 2px solid currentColor;
    border-radius: 0 0.42rem 0 0;
}

.study-period-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 12px;
    padding: 13px 15px;
    overflow: clip;
}

.study-period-header > div {
    display: grid;
    gap: 2px;
}

.study-period-header small {
    color: var(--muted);
}

.study-period-content-summary {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
}

.study-period-content-summary > article {
    min-width: 0;
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 7px 9px;
    border-radius: 10px;
    background: rgba(255, 255, 255, .035);
}

.study-period-content-summary > article > div,
.study-period-guidance {
    display: grid;
    gap: 2px;
}

.study-period-content-summary small,
.study-period-guidance {
    color: var(--muted);
}

.study-purpose-chip {
    flex: 0 0 auto;
    padding: 2px 7px;
    border: 1px solid color-mix(in srgb, var(--green) 55%, var(--line));
    border-radius: 999px;
    color: var(--green);
    font-size: .68rem;
    font-weight: 900;
    text-transform: uppercase;
}

.study-purpose-chip.is-revisar {
    border-color: color-mix(in srgb, var(--gold) 60%, var(--line));
    color: var(--gold-strong);
}

/* Study 3.1: the plan reads like a notebook list, with editors kept off-canvas. */
.study-compact-group,
.teacher-study-group {
    min-width: 0;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: rgba(15, 17, 21, .9);
    overflow: clip;
}

.study-compact-group > h3,
.teacher-study-group > h3 {
    margin: 0;
    padding: 9px 14px;
    border-bottom: 1px solid color-mix(in srgb, var(--gold) 25%, var(--line));
    background: linear-gradient(90deg, color-mix(in srgb, var(--gold) 11%, transparent), transparent 64%);
}

.study-compact-list,
.teacher-study-list {
    display: block;
}

.study-compact-item,
.teacher-study-item {
    width: 100%;
    border: 0;
    border-bottom: 1px solid rgba(247, 248, 250, .08);
    border-radius: 0;
    background: transparent;
}

.study-compact-item:last-of-type,
.teacher-study-item:last-of-type {
    border-bottom: 0;
}

.study-compact-item > summary,
.teacher-study-item > summary {
    display: grid;
    grid-template-columns: 10px minmax(0, 1fr);
    min-height: 54px;
    padding: 10px 14px;
}

.study-compact-item > summary:hover,
.teacher-study-item > summary:hover {
    background: rgba(255, 255, 255, .025);
}

.study-compact-body,
.teacher-study-item-body {
    gap: 10px;
    padding: 10px 14px 14px 34px;
    background: rgba(7, 8, 10, .26);
}

.study-list-note {
    padding-left: 10px;
    border-left: 2px solid color-mix(in srgb, var(--gold) 60%, transparent);
}

.study-item-actionbar {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
}

.study-item-actionbar .button {
    min-height: 36px;
    min-width: 0;
    padding: 7px 10px;
    white-space: normal;
    text-align: center;
}

.study-item-actionbar .nav-icon,
.study-item-actionbar .edit-line-icon,
.study-item-actionbar .note-line-icon {
    position: relative;
    display: inline-block;
    pointer-events: none;
    width: .95rem;
    height: .95rem;
    flex: 0 0 .95rem;
}

.study-inline-orientation,
.study-secondary-content {
    border: 1px solid rgba(247, 248, 250, .09);
    border-radius: 10px;
    background: rgba(255, 255, 255, .018);
    overflow: hidden;
}

.study-inline-orientation > summary,
.study-secondary-content > summary {
    min-height: 42px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 10px;
    cursor: pointer;
    list-style: none;
}

.study-inline-orientation > summary::-webkit-details-marker,
.study-secondary-content > summary::-webkit-details-marker {
    display: none;
}

.study-inline-orientation > summary > span:first-child {
    min-width: 0;
    display: grid;
    gap: 1px;
}

.study-inline-orientation > summary small {
    color: var(--muted);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.study-inline-orientation[open] > summary small,
.study-content-orientation[open] > summary small {
    display: none;
}

.study-inline-orientation[open] > summary {
    padding-bottom: 3px;
}

.study-inline-orientation > summary .edit-line-icon {
    width: 1rem;
    height: 1rem;
    flex: 0 0 1rem;
    color: var(--gold);
}

.study-inline-orientation > form {
    display: grid;
    gap: 8px;
    padding: 0 10px 10px;
}

.study-inline-orientation textarea {
    width: 100%;
    min-height: 4.5rem;
}

.study-inline-orientation > form > div {
    display: flex;
    justify-content: flex-end;
    gap: 7px;
}

.study-secondary-content > summary {
    justify-content: flex-start;
    color: var(--muted);
    font-weight: 800;
}

.study-secondary-content[open] > summary {
    border-bottom: 1px solid rgba(247, 248, 250, .08);
}

.study-secondary-content .study-resource-list {
    padding: 9px 10px 10px;
}

.study-plan-status-actions {
    padding-top: 9px;
    border-top: 1px solid rgba(247, 248, 250, .08);
}

.study-plan-period-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 12px;
    padding: 12px 14px;
    overflow: clip;
}

.study-plan-period-bar > div {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.study-plan-period-bar small {
    color: var(--muted);
}

.study-current-step-editor {
    display: grid;
    gap: 8px;
    padding: 12px;
    border: 1px solid color-mix(in srgb, var(--green) 34%, var(--line));
    border-radius: 12px;
    background: color-mix(in srgb, var(--green) 5%, rgba(7, 8, 10, .48));
}

.study-current-step-editor > div {
    display: grid;
    gap: 1px;
}

.study-current-step-editor > div small {
    color: var(--muted);
}

.study-current-step-editor .study-period-picker {
    margin-top: 2px;
}

.study-current-content-picker {
    border: 1px solid var(--line);
    border-radius: 12px;
    background: rgba(4, 6, 8, .3);
    overflow: hidden;
}

.study-current-content-picker > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 54px;
    padding: 10px 12px;
    cursor: pointer;
    list-style: none;
}

.study-current-content-picker > summary::-webkit-details-marker {
    display: none;
}

.study-current-content-picker > summary > span:first-child {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.study-current-content-picker > summary small {
    color: var(--muted);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.study-current-content-picker > summary > span:last-child {
    color: var(--brand-yellow);
    font-weight: 800;
}

.study-current-content-picker[open] > summary {
    border-bottom: 1px solid var(--line);
}

.study-current-content-picker .study-period-picker {
    padding: 12px;
}

.study-inline-details > summary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 36px;
    width: max-content;
    max-width: 100%;
    padding: 7px 11px;
    border: 1px solid var(--line);
    border-radius: 9px;
    background: rgba(255, 255, 255, .025);
    color: var(--text);
    text-align: left;
}

.study-inline-details > summary:hover {
    border-color: color-mix(in srgb, var(--gold) 55%, var(--line));
    background: color-mix(in srgb, var(--gold) 7%, rgba(255, 255, 255, .025));
}

.study-editor-dialog {
    width: min(720px, calc(100% - 28px));
    max-height: min(780px, calc(100dvh - 28px));
    padding: 0;
    border: 1px solid color-mix(in srgb, var(--gold) 42%, var(--line));
    border-radius: 17px;
    background: #111418;
    color: var(--text);
    box-shadow: 0 28px 90px rgba(0, 0, 0, .68);
    overflow: hidden;
}

.study-editor-dialog::backdrop {
    background: rgba(3, 4, 6, .78);
    backdrop-filter: blur(5px);
}

.study-editor-dialog > section {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    max-height: inherit;
}

.study-dialog-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 16px;
    border-bottom: 1px solid var(--line);
}

.study-dialog-header h2 {
    margin: 2px 0 0;
    font-size: 1.18rem;
}

.study-dialog-body {
    min-width: 0;
    display: grid;
    gap: 11px;
    padding: 14px 16px 16px;
    overflow-y: auto;
}

.study-dialog-actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding-top: 3px;
}

.limited-fee-choice {
    width: 100%;
    display: grid;
    gap: 2px;
    padding: 12px 14px;
    border: 1px solid color-mix(in srgb, var(--green) 42%, var(--line));
    border-radius: 11px;
    background: color-mix(in srgb, var(--green) 7%, rgba(7, 8, 10, .48));
    color: var(--text);
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.limited-fee-choice small {
    color: var(--muted);
}

.limited-fee-choice:hover,
.limited-fee-choice:focus-visible {
    border-color: var(--green);
}

.limited-fee-choice.danger-choice {
    border-color: color-mix(in srgb, var(--pink) 42%, var(--line));
    background: color-mix(in srgb, var(--pink) 6%, rgba(7, 8, 10, .48));
}

.limited-fee-choice.danger-choice:hover,
.limited-fee-choice.danger-choice:focus-visible {
    border-color: var(--pink);
}

.study-dialog-intro {
    margin: 0;
    color: var(--muted);
}

.study-content-dialog {
    width: min(900px, calc(100% - 28px));
}

.study-note-edit-list {
    display: grid;
    gap: 8px;
}

.study-note-edit-list > article {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: 8px;
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: 11px;
    background: rgba(7, 8, 10, .35);
}

.study-note-edit-list .account-form {
    min-width: 0;
    display: grid;
    gap: 8px;
}

.study-new-note-form {
    display: grid;
    gap: 8px;
    padding-top: 12px;
    border-top: 1px solid var(--line);
}

@media (max-width: 600px) {
    .study-plan-period-bar {
        align-items: stretch;
        flex-direction: column;
    }

    .study-plan-period-bar .button {
        width: 100%;
    }

    .study-compact-body,
    .teacher-study-item-body {
        padding-left: 14px;
    }

    .study-item-actionbar {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .study-item-actionbar .button {
        width: 100%;
        justify-content: flex-start;
    }

    .study-editor-dialog {
        width: calc(100% - 16px);
        max-height: calc(100dvh - 16px);
    }

    .study-dialog-header,
    .study-dialog-body {
        padding-left: 12px;
        padding-right: 12px;
    }

    .study-dialog-actions .button {
        flex: 1;
    }

    .study-note-edit-list > article {
        grid-template-columns: 1fr;
    }
}

.study-completed-period-note {
    display: grid;
    gap: 2px;
    padding: 9px 11px;
    border: 1px solid color-mix(in srgb, var(--green) 42%, var(--line));
    border-radius: 10px;
    background: color-mix(in srgb, var(--green) 8%, transparent);
}

.study-completed-period-note span {
    color: var(--muted);
    font-size: .84rem;
}

.study-objective-unit-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 4px;
}

.study-objective-unit-grid > article {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 5px;
    min-height: 36px;
    padding: 4px 5px 4px 9px;
    border-radius: 8px;
    background: rgba(255, 255, 255, .03);
}

.study-objective-unit-grid > article > span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.study-objective-unit-grid > article.is-completed > span {
    color: var(--muted);
    text-decoration: line-through;
}

.study-progress-caption {
    margin: 0;
    color: var(--muted);
    font-size: .82rem;
}

.study-choice-inline {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    padding: 9px 11px;
    border: 1px solid var(--line);
    border-radius: 10px;
}

.study-choice-inline label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.study-history-content {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 3px 7px;
    margin-top: 5px;
    color: var(--text);
    font-size: .86rem;
}

.study-history-content b {
    color: var(--gold-strong);
    font-size: .7rem;
    text-transform: uppercase;
}

.study-history-content small {
    grid-column: 2;
    color: var(--muted);
}

@media (max-width: 760px) {
    .study-add-entry,
    .study-period-header {
        align-items: stretch;
        flex-direction: column;
    }

    .study-add-entry .button {
        width: 100%;
    }

    .study-plan-wizard {
        width: calc(100% - 14px);
        max-height: calc(100dvh - 14px);
        border-radius: 15px;
    }

    .study-plan-wizard > form {
        max-height: calc(100dvh - 14px);
    }

    .study-choice-grid,
    .study-wizard-step[data-study-wizard-step="kind"] .study-choice-grid,
    .study-new-material-fields,
    .study-new-list-fields,
    .study-period-unit-list,
    .study-period-content-summary {
        grid-template-columns: 1fr;
    }

    .study-objective-unit-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .study-period-unit-options {
        grid-template-columns: 100px minmax(0, 1fr);
    }

    .study-wizard-step {
        min-height: 0;
        padding: 17px 14px;
    }

    .study-wizard-actions {
        padding: 10px 14px;
    }

    .study-wizard-actions .button {
        flex: 1;
    }
}

@media (max-width: 430px) {
    .study-objective-unit-grid {
        grid-template-columns: 1fr;
    }

    .study-period-unit-options {
        grid-template-columns: 1fr;
    }
}

@media (prefers-reduced-motion: reduce) {
    .study-view-tabs a,
    .study-compact-chevron {
        transition: none;
    }
}

.dashboard-study-summary {
    display: grid;
    gap: 12px;
}

.dashboard-study-summary > header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.dashboard-study-summary h2 {
    margin: 2px 0 0;
}

.dashboard-study-note {
    margin: 0;
    color: var(--muted);
}

.dashboard-study-items {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
}

.dashboard-study-items > span {
    min-width: 0;
    display: grid;
    gap: 1px;
    padding: 8px 10px;
    border-radius: 10px;
    background: rgba(255, 255, 255, .035);
}

.dashboard-study-items strong,
.dashboard-study-items small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard-study-items small {
    color: var(--muted);
}

@media (max-width: 600px) {
    .dashboard-study-summary > header {
        align-items: flex-start;
    }

    .dashboard-study-items {
        grid-template-columns: 1fr;
    }
}

/* Study 4.1: compact actions and period-specific guidance. */
.teacher-study-item {
    position: relative;
}

.teacher-study-item > summary {
    padding-right: 58px;
}

.study-item-title-line {
    min-width: 0;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 5px 8px;
}

.study-item-title-line > strong {
    min-width: 0;
    max-width: 100%;
}

.study-item-title-line .status-chip {
    flex: 0 1 auto;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.study-summary-remove {
    position: absolute;
    z-index: 3;
    top: 8px;
    right: 9px;
}

.study-summary-remove .icon-button {
    width: 38px;
    min-width: 38px;
    height: 38px;
    min-height: 38px;
}

.study-edit-box-icon,
.study-checklist-icon,
.pause-line-icon,
.play-line-icon,
.check-line-icon {
    position: relative;
    display: inline-block;
    width: 1rem;
    height: 1rem;
    flex: 0 0 1rem;
    color: currentColor;
}

.study-edit-box-icon::before {
    content: "";
    position: absolute;
    left: .06rem;
    bottom: .04rem;
    width: .68rem;
    height: .68rem;
    border: 1.6px solid currentColor;
    border-radius: .18rem;
}

.study-edit-box-icon::after {
    content: "";
    position: absolute;
    top: -.02rem;
    right: .08rem;
    width: .2rem;
    height: .68rem;
    border: 1.6px solid currentColor;
    border-radius: .18rem .18rem 0 0;
    background: #111418;
    transform: rotate(43deg);
    transform-origin: center;
}

.study-checklist-icon::before {
    content: "";
    position: absolute;
    top: .2rem;
    right: .02rem;
    width: .57rem;
    height: .1rem;
    border-radius: 999px;
    background: currentColor;
    box-shadow: 0 .31rem 0 currentColor, 0 .62rem 0 currentColor;
}

.study-checklist-icon::after {
    content: "";
    position: absolute;
    top: .08rem;
    left: .08rem;
    width: .18rem;
    height: .35rem;
    border-right: 1.7px solid currentColor;
    border-bottom: 1.7px solid currentColor;
    box-shadow: .31rem .31rem 0 -.05rem transparent;
    transform: rotate(42deg);
}

.pause-line-icon::before,
.pause-line-icon::after {
    content: "";
    position: absolute;
    top: .13rem;
    width: .22rem;
    height: .74rem;
    border-radius: .1rem;
    background: currentColor;
}

.pause-line-icon::before { left: .23rem; }
.pause-line-icon::after { right: .23rem; }

.play-line-icon::before {
    content: "";
    position: absolute;
    inset: .12rem .15rem;
    background: currentColor;
    clip-path: polygon(12% 0, 100% 50%, 12% 100%);
}

.check-line-icon::before {
    content: "";
    position: absolute;
    left: .16rem;
    top: .06rem;
    width: .4rem;
    height: .7rem;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(42deg);
}

.study-general-orientation {
    margin-bottom: 5px;
    border-color: color-mix(in srgb, var(--gold) 28%, rgba(247, 248, 250, .09));
}

.study-inline-orientation > form > label,
.study-content-orientation > form > label {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
}

.study-secondary-content > summary .paperclip-line-icon {
    color: var(--gold);
}

.study-current-contents {
    gap: 8px;
    margin-top: 4px;
    padding-top: 12px;
    border-top: 1px solid rgba(247, 248, 250, .08);
}

.study-current-contents-heading {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.study-current-contents-heading > span {
    min-width: 0;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: var(--gold-strong);
    font-size: .78rem;
    text-transform: uppercase;
}

.study-current-contents-heading .button {
    flex: 0 0 auto;
    min-height: 34px;
    padding: 6px 9px;
}

.study-period-content-summary > article {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: start;
}

.study-content-orientation {
    min-width: 0;
}

.study-content-orientation > summary {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    cursor: pointer;
    list-style: none;
}

.study-content-orientation > summary::-webkit-details-marker {
    display: none;
}

.study-content-orientation > summary > span:first-child {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.study-content-orientation > summary strong,
.study-content-orientation > summary small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.study-content-orientation > summary small {
    color: var(--muted);
    font-size: .72rem;
}

.study-content-orientation > summary .study-edit-box-icon {
    color: var(--gold);
    opacity: .82;
}

.study-content-orientation > form {
    display: grid;
    gap: 7px;
    padding-top: 5px;
}

.study-content-orientation textarea {
    width: 100%;
    min-height: 4.2rem;
}

.study-content-orientation > form > div {
    display: flex;
    justify-content: flex-end;
    gap: 7px;
}

.teacher-study-item-body,
.study-compact-body {
    transform-origin: top;
    will-change: height, opacity;
}

/* Clearer section pictograms. */
.study-area-icon.is-method::before,
.study-area-icon.is-method::after {
    top: 5px;
    width: 8px;
    height: 13px;
    border: 1.5px solid currentColor;
    background: transparent;
}

.study-area-icon.is-method::before {
    left: 3px;
    border-right-width: 1px;
    border-radius: 4px 1px 1px 3px;
    transform: skewY(-7deg);
}

.study-area-icon.is-method::after {
    right: 3px;
    border-left-width: 1px;
    border-radius: 1px 4px 3px 1px;
    transform: skewY(7deg);
}

.study-area-icon.is-repertoire {
    width: 27px;
    height: 34px;
    flex-basis: 27px;
    overflow: visible;
}

.study-area-icon.is-repertoire::before {
    font-size: 23px;
    line-height: 1;
    transform: translateY(3px);
}

.study-area-icon.is-technique::before {
    left: 2px;
    top: 6px;
    width: 20px;
    height: 12px;
    border: 1.5px solid currentColor;
    border-radius: 2px;
    background: repeating-linear-gradient(90deg, transparent 0 4px, currentColor 4px 5px);
}

.study-area-icon.is-technique::after {
    left: 6px;
    top: 6px;
    width: 3px;
    height: 7px;
    border-radius: 0 0 1px 1px;
    background: #111418;
    box-shadow: 5px 0 0 #111418, 10px 0 0 #111418;
}

@media (max-width: 600px) {
    .teacher-study-item > summary {
        padding-right: 53px;
    }

    .study-item-title-line {
        align-items: flex-start;
        flex-direction: column;
        gap: 4px;
    }

    .study-item-title-line .status-chip {
        font-size: .62rem;
    }

    .study-current-contents-heading {
        align-items: stretch;
        flex-direction: column;
    }

    .study-current-contents-heading .button {
        width: 100%;
        justify-content: center;
    }

    .study-period-content-summary > article {
        grid-template-columns: auto minmax(0, 1fr) auto;
    }
}

@media (prefers-reduced-motion: reduce) {
    .teacher-study-item-body,
    .study-compact-body {
        will-change: auto;
    }
}